ब्लॉग टेम्पलेट को कैसे मोबाइल फ्रेंडली बनाये ( Responsive Web Design)

    मोबाइल फ्रेंडली वेब डिज़ाइन  इन दिनों प्रोफेशनल  वेब डिजाइनिंग का एक हिस्सा बन गई  है। यहां तक ​​कि अपनी वेबसाइट या ब्लॉग पर हर कोई मोबाइल फ्रेंडली वेब डिजाइन चाहता हैं। लगभग सभी बड़े वेब प्लेटफार्म मोबाइल फ्रेंडली वेब  संस्करण का उपयोग कर रहे हैं। मोबाइल फ्रेंडली वेब डिज़ाइन तेज गति से लोड होने के साथ ही Seo Friendly भी है । लेकिन मुख्य सवाल है, हम मोबाइल फ्रेंडली वेब डिज़ाइन  के रूप में वेबसाइट टेम्पलेट डिजाइन कर सकते हैं,हम मोबाइल फ्रेंडली ब्लॉग टेम्प्लेट के रूप में ब्लॉगर आधारित टेम्पलेट डिजाइन कर सकते है?  तो जवाब है , हाँ आप कर सकते हैं। जैसा की आप जानते है की ब्लॉगर ब्लॉग के विकास के लिए एक बड़ा सीएमएस मंच  है। यहां तक ​​कि ब्लॉगर प्लेटफार्म पर WordPress की तुलना में कई अदभुत फीचर हैं। WordPress  की तुलना में टेम्पलेट डिजाइन और अधिक आसान ब्लॉगर में है। आकर्षक वेब  डिजाइन करने के लिए हमे  उन्नत तकनीकी  डिजाइन भाषाओं जैसे : एचटीएमएल, सीएसएस, js , jQuery, ajax आदि की जरूरत होती है।
इसी कड़ी में आज मैं आपको मोबाइल फ्रेंडली ब्लॉगर टेम्पलेट में अपने वर्तमान ब्लॉगर टेम्पलेट को  परिवर्तित करने के लिए कुछ आसान चरण जिनसे की कुछ ही पलो में आपकी ब्लॉग टेम्पलेट पूरी तरह मोबाइल फ्रेंडली होगी बस नीचे बताई प्रक्रिया अपनाये :- 

Continue Reading

ब्लॉगर मोबाइल संस्करण पर Whatsapp, Email , Sms शेयर बटन कैसे जोड़े

         हिंदी ब्लॉगर के लिए फेसबुक , ट्विटर , व्हाट्सएप्प जैसे सोशल नेटवर्क की हमेशा ही अहम भूमिका रही  है। आज  ब्लॉगर  और इसी के साथ वर्डप्रेस , सेल्फ होस्टेड साइट आदि चिट्ठो पर  पाठको के आवागमन का अनुमान लगाया जाये तो हम देखते है की ब्लॉगों पर प्रतिदिन आने वाले पाठको में सोशल नेटवर्क साइट्स द्वारा सबसे ज्यादा पाठको का आवागमन रहा है , निश्चित रूप से कारण फेसबुक , व्हाट्सएप , ट्विटर जैसे सोशल नेटवर्क का बढ़ता हुआ प्रचलन और लोगो का इस और बढ़ता हुआ जबरदस्त रुझान।  

         आज के इस ट्यूटोरियल में बताया गया है की कैसे अपनी ब्लॉग पोस्ट को साझा करने के लिए WhatsApp Share, Email Share और Sms Share  के द्वारा लोगो तक पहुचाया जाये । बस नीचे दी हुई प्रक्रिया अपनाये और अपने ब्लॉग पर कुछ ही मिनटों में   WhatsApp Share, Email Share और Sms Share बटन द्वारा ब्लॉग ट्रैफिक बढ़ाये , ध्यान दे की ब्लॉग द्वारा ब्लॉगर पाठको को दी गयी आधिकारिक मोबाइल टेम्पलेट पर यह कोड कार्यशील नहीं है इस सम्बन्ध में निवेदन करेंगे की अपनी ब्लॉग टेम्पलेट को मोबाइल फ्रेंडली  (Responceive ) ब्लॉग टेम्पलेट में बदले तत्पश्चात नीचे बताये कोड का इस्तेमाल करे। 

Continue Reading

कैसे बनाये ब्लॉगर ब्लॉग .....

पिछले सप्ताह किन्ही श्याम जी का ईमेल प्राप्त हुआ॥ श्याम जी का कहना था की ॥ उन्होने hindi4tech ब्लॉग को देखा और वो भी ब्लॉगर प्लेटफोर्म पर एक ब्लॉग बनाना चाहते है ... मगर इसमें परेशानी के चलते उन्होने मुझसे संपर्क किया ॥ :० )

अपने बारे में तो श्याम जी ने कुछ ख़ास बताया नहीं...और न ही में उनसे उनके बारे में कुछ पूछ सका सिर्फ इतने बताया की वो जोनपुर उत्तरप्रदेश के रहने वाले है ... व्यस्तता के चलते पिछले सप्ताह मिले उनके ईमेल का जवाब उन्हे आज दे पा रहा हूँ... श्याम जी अगर hindi4tech की इस पोस्ट को पड़ रहे है तो बताना चाहूँगा की आपके ईमेल के प्रति उतर ईमेल आपको आपके ईमेल पते पर भेज दिया गया है कृपया अपना ईमेल चेक करे ... और जवाबी ईमेल भेजने में हुई देरी के लिए खेद व्यक्त करता हूँ ॥

नीचे ब्लॉगर ब्लॉग बनाने हेतु बेहत आसन tutorial विडियो माध्यम से बताया गया है ॥ आशा करता हूँ इसके द्वारा आप ब्लॉगर प्लेटफोर्म पर अपना ब्लॉगर ब्लॉग तैयार कर पायेंगे :० )

ध्यान दे की ब्लॉगर ब्लॉग पर ब्लॉग बनाने के लिए प्रथम प्रक्रिया ईमेल खता बनाने से शुरू होती है ... अतः मेरी राय में सबसे पहले आप गूगल के gmail.com साईट पर जा कर अपने लिए ईमेल खता पंजीकृत करे ॥ अगर आप के पास yahoo , या Rediffmail का ईमेल खता पहले ही से है व आप इसी के द्वारा अपना ब्लॉग बनाना चाहते है । तो नीचे विडियो में बताये अनुसार blogger.com पर जाये व विडियो tutorial में बताये अनुसार प्रक्रिया अपनाये

Continue Reading

ब्लॉगर Thread कमेन्ट में reply बटन क्यों काम नहीं कर रहा..??

कुछ ही महीनो पहले ब्लॉगर टीम द्वारा नयी सुविधा " ब्लॉगर Thread Comment" को सार्वजनिक किया गया ... लगभग सभी ने इसे अपने ब्लॉग पर सक्रिय कर लिया होगा... ब्लॉगर द्वारा सुझाये गए इस कमेन्ट फॉर्म और साधारण कमेन्ट फॉर्म में कई संशोधन के साथ ही नए thread comment में कई नयी सुविधाओ को भी जोड़ा गया ॥ जिनमे एक मुख्य .....कमेन्ट का reply बटन ... जिसके द्वारा पाठको द्वारा लेख पर दी गयी प्रतिक्रिया पर अन्य पाठक भी अपने विचार सीधे reply बटन द्वारा पूर्व में टिपण्णी करता को भेज सकते है॥ जैसे ही टिपण्णी में reply बटन या प्रतिउतर बटन का इस्तेमाल कर प्रतिक्रिया भेजी जाती है ब्लॉगर द्वारा उसे स्वतः ही सम्बंधित टिपण्णीकर्ता के ईमेल पते पर अग्रेषित कर दिया जाता है...
सभी ने इसे सुविधा को अपने ब्लॉग पर सक्रिय तो कर लिया ,,, मगर बहुत से ब्लोगों पर " reply" बटन अभी भी कार्य नहीं कर रहा है॥ इसके जीवंत उदाहरण मैने बहुत से हिंदी ब्लोगों पर देखे है ॥ इसी के चलते सोचा आज इसी परेशानी के निराकरण हेतु एक पोस्ट लिखी जाये ॥ सबसे पहले ये समझे के thred comment सुविधा शुरू होने के बाद reply बटन का कार्य न करने का क्या कारण है ... इसका जवाब सिर्फ एक ही है की ब्लॉगर thred comment में thread comment हेतु प्रक्रिया तो पूर्ण कर ली गयी मगर सुविधा हो पूर्ण करने के पश्चात् ब्लॉगर द्वारा ब्लॉग टेम्पलेट में स्वतः ही एक स्क्रिप्ट को add कर लिया जाता है ॥ अतः यह जान ले की reply बटन का काम न करना का एक और सिर्फ एक कारन इस स्क्रिप्ट का छतिग्रस्त होना ही है॥ अतः आज इस लेख में यही बताया गया है की कैसे इस छतिग्रस्त स्क्रिप्ट को बदल कर ब्लॉग पर reply बटन सक्रिय किया जाये ॥
अतः reply बटन सक्रिय करने के लिए नीचे बताई प्रक्रिया अपनाये ....:)

ध्यान दे:-टेम्पलेट में कुछ भी बदलाव करने से पहले नीचे छवि में बताये अनुसार लिंक पर क्लिक कर टेम्प्लेट जरुर डाउनलोड कर ले

Step 1

• अपने blogger dashboard पर जाए
• यहाँ जाए Dashbord > Design > Edit HTML
• अब ऊपर Expand Widgets चेक बॉक्स पर क्लिक करे
• यहाँ पर <b:includable id='threaded_comment_js' var='post'> कोड तलाशे
• इस कोड के ठीक नीचे एक स्क्रिप्ट होगी , अतः इस कोड को मय स्क्रिप्ट नीचे बताये कोड से बदले

<b:includable id='threaded_comment_js' var='post'>
<script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>
<script type='text/javascript'>
(function() {
var items = <data:post.commentJso/>;
var msgs = <data:post.commentMsgs/>;
var config = <data:post.commentConfig/>;
// <![CDATA[
var cursor = null;
if (items && items.length > 0) {
cursor = parseInt(items[items.length - 1].timestamp) + 1;
}
var bodyFromEntry = function(entry) {
if (entry.gd$extendedProperty) {
for (var k in entry.gd$extendedProperty) {
if (entry.gd$extendedProperty[k].name == 'blogger.contentRemoved') {
return '<span class="deleted-comment">' + entry.content.$t + '</span>';
}
}
}
return entry.content.$t;
}
var parse = function(data) {
cursor = null;
var comments = [];
if (data && data.feed && data.feed.entry) {
for (var i = 0, entry; entry = data.feed.entry[i]; i++) {
var comment = {};
// comment ID, parsed out of the original id format
var id = /blog-(\d+).post-(\d+)/.exec(entry.id.$t);
comment.id = id ? id[2] : null;
comment.body = bodyFromEntry(entry);
comment.timestamp = Date.parse(entry.published.$t) + '';
if (entry.author && entry.author.constructor === Array) {
var auth = entry.author[0];
if (auth) {
comment.author = {
name: (auth.name ? auth.name.$t : undefined),
profileUrl: (auth.uri ? auth.uri.$t : undefined),
avatarUrl: (auth.gd$image ? auth.gd$image.src : undefined)
};
}
}
if (entry.link) {
if (entry.link[2]) {
comment.link = comment.permalink = entry.link[2].href;
}
if (entry.link[3]) {
var pid = /.*comments\/default\/(\d+)\?.*/.exec(entry.link[3].href);
if (pid && pid[1]) {
comment.parentId = pid[1];
}
}
}
comment.deleteclass = 'item-control blog-admin';
if (entry.gd$extendedProperty) {
for (var k in entry.gd$extendedProperty) {
if (entry.gd$extendedProperty[k].name == 'blogger.itemClass') {
comment.deleteclass += ' ' + entry.gd$extendedProperty[k].value;
}
}
}
comments.push(comment);
}
}
return comments;
};
var paginator = function(callback) {
if (hasMore()) {
var url = config.feed + '?alt=json&v=2&orderby=published&reverse=false&max-results=50';
if (cursor) {
url += '&published-min=' + new Date(cursor).toISOString();
}
window.bloggercomments = function(data) {
var parsed = parse(data);
cursor = parsed.length < 50 ? null
: parseInt(parsed[parsed.length - 1].timestamp) + 1
callback(parsed);
window.bloggercomments = null;
}
url += '&callback=bloggercomments';
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = url;
document.getElementsByTagName('head')[0].appendChild(script);
}
};
var hasMore = function() {
return !!cursor;
};
var getMeta = function(key, comment) {
if ('iswriter' == key) {
var matches = !!comment.author
&& comment.author.name == config.authorName
&& comment.author.profileUrl == config.authorUrl;
return matches ? 'true' : '';
} else if ('deletelink' == key) {
return config.baseUri + '/delete-comment.g?blogID='
+ config.blogId + '&postID=' + comment.id;
} else if ('deleteclass' == key) {
return comment.deleteclass;
}
return '';
};
var replybox = null;
var replyUrlParts = null;
var replyParent = undefined;
var onReply = function(commentId, domId) {
if (replybox == null) {
// lazily cache replybox, and adjust to suit this style:
replybox = document.getElementById('comment-editor');
if (replybox != null) {
replybox.height = '250px';
replybox.style.display = 'block';
replyUrlParts = replybox.src.split('#');
}
}
if (replybox && (commentId !== replyParent)) {
document.getElementById(domId).insertBefore(replybox, null);
replybox.src = replyUrlParts[0]
+ (commentId ? '&parentID=' + commentId : '')
+ '#' + replyUrlParts[1];
replyParent = commentId;
}
};
var hash = (window.location.hash || '#').substring(1);
var startThread, targetComment;
if (/^comment-form_/.test(hash)) {
startThread = hash.substring('comment-form_'.length);
} else if (/^c[0-9]+$/.test(hash)) {
targetComment = hash.substring(1);
}
// Configure commenting API:
var configJso = {
'maxDepth': config.maxThreadDepth
};
var provider = {
'id': config.postId,
'data': items,
'loadNext': paginator,
'hasMore': hasMore,
'getMeta': getMeta,
'onReply': onReply,
'rendered': true,
'initComment': targetComment,
'initReplyThread': startThread,
'config': configJso,
'messages': msgs
};
var render = function() {
if (window.goog && window.goog.comments) {
var holder = document.getElementById('comment-holder');
window.goog.comments.render(holder, provider);
}
};
// render now, or queue to render when library loads:
if (window.goog && window.goog.comments) {
render();
} else {
window.goog = window.goog || {};
window.goog.comments = window.goog.comments || {};
window.goog.comments.loadQueue = window.goog.comments.loadQueue || [];
window.goog.comments.loadQueue.push(render);
}
})();
// ]]>
</script>
</b:includable>

अब परिवर्तन सेव करे ... आशा करता हूँ आपके ब्लॉग पर " Reply" बटन कार्य करने लगा होगा... किसी परेशानी के चलते कमेन्ट के माध्यम से संपर्क करे ...:)

Continue Reading