आपको इस post में blog या site के लिए HTML Sitemap Page को बनाने और इसे blog में add करने के लिए बतलाऊंगा | Sitemap two types के होते है :
- XML Sitemap
- HTML Sitemap
XML Sitemap को आप एक small file का सकते है जिसमे हमारे blog या site का सारा content XML format में होता है | XML Sitemap हमारे blog के सारे content को Google Search Engine में Index करने में help करता है | इसके बारे में और अधिक जानकारी के लिए यह post पढ़े |
- XML Sitemap कैसे बनाये Blog या Website के लिए ?
- Blog के Sitemap को Google Search Console में Submit कैसे करे ?
- Blogger Sitemap को Yandex Webmaster Tool में Submit कैसे करे ?
HTML Sitemap में हमारे blog पर publish किये गए सारे post का list होता है | यह HTML format में होता है | अतः इसमें post का जो list होता है, उसको read कर सकते है | यह हमारे blogger post को search engine में index तो नहीं करता है परंतु इसकी मदद से आप अपने blog या site के pageviews को increase कर सकते है | क्योकि HTML sitemap में blog का सारा publish post एक जगह एक पेज पर show होता है |
इसके लिए आपको blog में HTML sitemap page को create करना है और फिर उसके बाद इस page के link को blog के menu bar में add करना है | इस link को जी भी visitors open करेगा, उन्हें आपके blog का सारा post एक page में दिखाई देगा |
मैंने पिछले post में Blogger Archive Page को बनाने के बारे में बतलाया था | इस पेज में भी सारा post एक place पर एक page पर show होता है | परंतु यह categories में show नहीं होता है |
इस post में मैं जिस sitemap page को बनाने के बारे में बता रहा हूँ , वह बहुत ही attractive है और 100 % यह आपके में blog में work करेगी | इसमें सभी post एक page में categories या label में show होगी | इससे visitors को आपके blog के सारे post को navigate करने में आसानी होगी | वे अपने पसंद और जरुरत के post को आसानी से search कर सकते है |
अब मैं आको बताना शुरू करता हौं कि blogger blog के लिए HTML Sitemap page कैसे बनाते है ?
HTML Sitemap Page कैसे बनाये blog के लिए ?
HTML Sitemap Page बनाने के लिए आप मेरे steps को follow करें :-
Step 1
सबसे पहले अपने blogger account में login करके blogger dashboard पर जाएं |
- Pages >> All पर click करें |
- New page पर click करें |
Step 2
अब page editor open होगा |
- Title area में page का नाम अपने हिसाब से कुछ भी लिखे सकते है जैसे कि Sitemap, All Post, Archive etc.
- HTML पर click करके HTML mode को ON करे |
- Page के body section में नीचे दिया गया code को copy करके paste कर दे |
- Page setting में Don’t allow, Show HTML Literally, Use <br> tag के check box में tick करके Done पर click करें |
- Publish पर click करे |
HTML Sitemap Code
Loading, please wait for a moment…</span>
</div>
<br />
<script type = “text/javascript”>
var tabbedTOC = {
blogUrl: “http://www.newfeatureblog.com“, // Enter your blog URL
containerId: “tabbed-toc”, // Container ID
activeTab: 1, // The default active tab index (default: the first tab)
showDates: false, // `true` to show the post date showSummaries: false, // `true` to show the posts summaries numChars: 200, // Number of summary chars
showThumbnails: false, // `true` to show the posts thumbnails (Not recommended)
thumbSize: 40, // Default thumbnail size
noThumb: “”, // A “no thumbnail” URL
monthNames: [ // Array of month names
“January”,
“February”,
“March”,”
April”,
“May”,
“June”,
“July”,
“August”,
“September”,
“October”,
“November”,
“December”
],
newTabLink: true, // Open link in new window. `false` to open in samewindow
maxResults: 99999, // Maximum post results
preload: 0, // Load the feed after 0 seconds (option => time in milliseconds || “onload”)
sortAlphabetically: true, // `false` to sort posts by published date
showNew: 7, // `false` to hide the “New!” mark in most recent posts or//define how many recent posts are to be marked by changing the number
newText: ” – <em style=’color: white;padding: 1px 5px;border-radius: 20px;background-color: #F00;’>New!</em>” // HTML/CSS for
//the “New!” text
};
</script>
<
<style>/*Sitemap */
#tabbed-toc {
width: 99%;
margin: 0 auto;
overflow: hidden !important;
position: relative;
color: #222;
border: 0;
border-top: 5px solid #FC0204;
background-color: #1D1D1D;
-webkit-transition: all 0.4s ease-in-out;
}
#tabbed-toc .loading {
display:block;
padding:5px 15px;
font:normal bold 11px Arial,Sans-Serif;
color:#FFF;
}
#tabbed-toc ul,
#tabbed-toc ol,
#tabbed-toc li {
margin:0;
padding:0;
list-style:none;
}
#tabbed-toc .toc-tabs {
width: 24.8%;
float: left !important;
}
#tabbed-toc .toc-tabs li a {
display:block;
font:normal bold 10px/28px Arial,Sans-Serif;
height:28px;
overflow:hidden;
text-overflow:ellipsis;
color:#ccc;
text-transform:uppercase;
text-decoration:none;
padding:0 12px;
cursor:pointer;
-webkit-transition: all 0.3s ease-in-out;
}
#tabbed-toc .toc-tabs li a:hover {
background-color: #515050;
color: #FFF;
}
#tabbed-toc .toc-tabs li a.active-tab {
background-color:#FFFC03;
color: #222;
position: relative;
z-index: 5;
margin: 0 -2px 0 0;
}
#tabbed-toc .toc-content,
#tabbed-toc .divider-layer {
width: 75%;float: right !important;
background-color: #F5F5F5;
border-left: 5px solid#FFFC03;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all 0.3s ease-in-out;
}
#tabbed-toc .divider-layer {
float:none;
display:block;
position:absolute;
top:0; right:0;
bottom:0;
}
#tabbed-toc .panel {
position:relative;
z-index:5;
font:normal normal 10px Arial,Sans-Serif;
}
#tabbed-toc .panel li a {
display: block;
position: relative;
font-weight: bold;
font-size: 11px;
color: #222;
line-height: 2.8em;
height: 30px;
padding: 0 10px;
text-decoration: none;
outline: none;
overflow: hidden;
-webkit-transition: all 0.3s ease-in-out;
}
#tabbed-toc .panel li time {
display:block;
font-style:italic;
font-weight:400;
font-size:10px;
color:#666;
float:right;
}
#tabbed-toc .panel li .summary {
display:block;
padding:10px 12px;
font-style:italic;
border-bottom:4px solid #275827;
overflow:hidden;
}
#tabbed-toc .panel li .summary img.thumbnail {
float:left;
display:block;
margin:0 8px 0 0;
padding:4px;
width:72px;
height:72px;
border:1px solid #dcdcdc;
background-color:#fafafa;
}
#tabbed-toc .panel li:nth-child(even) {
background-color: #DBDBDB;
font-size: 10px;
}
#tabbed-toc .panel li a:hover,
#tabbed-toc .panel li a:focus,
#tabbed-toc .panel li a:hover time,
#tabbed-toc .panel li.bold a {
background-color:#222;
color:#FFF;
outline:none;
-webkit-transition: all 0.3s ease-in-out;
}
#tabbed-toc .panel li.bold a:hover,
#tabbed-toc .panel li.bold a:hover time {
background-color:#222;
}
@media (max-width:700px) {
#tabbed-toc {
background-color:#fff;
border:0 solid #888;
}
#tabbed-toc .toc-tabs,
#tabbed-toc .toc-content {
overflow:hidden;
width:auto;
float:none !important;
display:block;
}
#tabbed-toc .toc-tabs li {
display:inline;
float:left !important;
}
#tabbed-toc .toc-tabs li a,
#tabbed-toc .toc-tabs li a.active-tab {
background-color:#222;
color:#ccc;
}
#tabbed-toc .toc-tabs li a.active-tab {
color:#000;
}#tabbed-toc .toc-content {
border:none;
}
#tabbed-toc .divider-layer,
#tabbed-toc .panel li time {
display:none;
}
}</style>
credit : code source
Customize Code
Code में http://www.newfeatureblog.com के स्थान पर आप अपने blog का URL लिखें | यदि आप free BlogSpot domain name का use करते है तो आपके blog का URL कुछ इस तरह का होगा : http://YourBlogName.blogspot.com | अगर आप custom domain name का use करते है तो URL कुछ इस तरह का होगा : http://www.YourBlogName.com |
Blogger HTML Sitemap कुछ इस तरह का show होगा | नीच screenshot देखें |
अब आप अपने Blogger stemap के link को blog के footer में add कर सकते है |
Blogger HTML Sitemap Page का Link Address कैसे पता करें ?
- Pages >> All पर click करे |
- जिस page का link चाहिए, उस page के view button पर cursor को ले जाकर link address को copy कर ले | अगर आपने mobile पर blog को open किया है तो view पर long press करके link को copy कर ले |
Blogger HTML Sitemap Page के Link को Footer में कैसे Add करे ?
Blogger HTML Sitemap page के link address को footer में add करने का मैं सबसे simple method बतलाता हूँ :-
Theme >> Footer वाला Add a Gadget >> Page >> tick sitemap page >> Save
ये भी पढ़े :
- RevenueHits Ads Network पर Account बनाकर पैसा कैसे कमाये ?
- RevenueHits पर Ads बनाकर Blog या Site में Add कैसे करे और paisa कमाएं ?
उम्मीद है कि आपको यह post पसंद आया होगा | Blogger HTML Sitemap page को बनाने में कोई भी problem आती है तो मुझे comment करें |
इस blog के सभी new post को direct अपने email पर पाने के लिए subscribe करें | अगर यह post आपको पसंद आया हो तो इसे facebook, twitter, google plus etc., जैसे social sites पर share करें |
Thank you