Skip to content Skip to sidebar Skip to footer

Widget Atas Posting

How to Make a Simple Sitemap ( Step by Step ) on Blogger

Sitemap is now important, why? because a sitemap can tell visitors about "this is our content", so visitors can determine whether they will stay with our website, or will subscribe, or bookmark our website address in their favorite browser.

We can never know.. because it's beyond our control.. Stay or Leave is a choice...

So yes, as a writer and website manager, a form of effort is to manage the website as well as possible, as comfortable as possible not only to be comfortable in the eyes of search engines.


Our real target is not the engine... SEO is just a means to be seen.. but that's not the main thing.. 

Back in the past, I really liked websites with magazine themes.. some of the topics were clearly displayed on the homepage..

And finally in 2016, I have it.. it feels like.. well it turns out to be..




The era of 2019 and above is the era of seducing search engines..



Every blog and website is competing to win the hearts of the search engines by getting the highest score on Google Pagespeed ( Faster = Winner? ). Because it is said that a website that is super fast and a value of 100 can control traffic.


Pages / Page Authority..


That is the key to winning the SERP game, maybe for Blogger friends who choose a path like me,


could take advantage of that...


So we focus on knick-knacks on the main page only.. then we really optimize it on other pages, especially on the Item Pages.. Non Homepage..


Do you know what I mean?


I discussed in detail about Conditional Tags... the conditional tag function is to condition a widget/javascript to run only on certain tag pages..


For example, homepage only, or Items only or on index or static pages..

Bro, now we don't only optimize on Desktop, but Mobile, which in fact needs very extra optimization..

I have made a Journal / Guide or some kind of development notes from my personal notes in managing the RahmanCyber NET website website

Guide on How to Speed Up Blogger's Mobile Display 

Please read.. the guide article, updated regularly "Maybe yes, maybe no".. you can also bookmark or follow this blog to get updates earlier when I update..

But the weakness is, because the topic discussed on RahmanCyber NET is not a niche topic, but Geneal.. you will get random readings according to my writing mood..

If you like niche ones, please browse the RahmanCyber NET section of the web





Then what is the relevance to this Sitemap

Sitemap is like a guide.. and this is very useful for General Blog Blogs such as RahmanCyber NET.. to provide guidance on where visitors will dock.. to what posts to go to...


Maybe visitors can also participate in making corrections to articles that are still lacking or still not tidy... you can also contribute...


Because indeed doing updates for past postings takes time that is set aside from the main daily work and normal life... 


If you find the topic useful, you can notify me via comments.. so I might be able to continue research on the topic.. :D 





Blogger is different from WordPress 




Yes, blogger is different from self-hosting wordpress.. so don't ever equate it. Almost all work on Blogger is done manually, in contrast to WordPress, which removes broken links, you can use Plugins.. You can do bulk here and there, and you can get lots of tags..


To be able to win SEO, bloggers rely on the keywords in their writing manually.


There are also many things that make the difference, in blogger even for the script code in the template, it is open, whereas if we use wordpress.. it can be closed or hidden, while for other plugins, just install it... although in fact many in blogger just install it only .. but if the wordpress GUI.

This blogger..


A platform that can be enjoyed by many people only with an internet connection capital.. imagine if it's our less fortunate brother, he can even pour his thoughts on the Internet just by opening a Blogger account


Free account, and he can take advantage of the existing free hotspot or free quota to start his life career..


As long as it plays a role in the content itself... I really appreciate that...



How to install a Sitemap?

Here I will share the sitemap on MyShorttips.Com...

You can also use it.. please.. and it's not easy to get an error even if you change or update the sitemap page or sitemap, because the javascript code from the sitemap is already hosted outside via Github, and connected via CDN

What the heck is that? 

Github is a platform where we can put code or even web projects for private or for ourselves or for many people. You can go to

Usually web programmers are very attached to this GIT..because it deals with code..

Then to be able to be called on Blogger, we need to convert the RAW link to a CDN so that it can be called on Blogger

Loh Sis, is not burdensome Blog? then if the CDN server is down.. what about it?

That's why we use it not in a vital area of ​​the blog or which is definitely loaded when the website is visited... edited the template for example... but we only use it in certain areas..

Even though some others such as the JQuery library and Font awesome we still use the link outside, because I tried to include everything in the edit html but it became heavy... because the CSS Font code was awesome, and the Jquery javascript was really really long


So the point..


We only put it on the sitemap page, meaning that if the sitemap page is visited, then the Javascript or .Js code is called..




Curious about the code? 




First, Please first create a new page on Blogger...then finish it in HTML Display mode Like this, 



Tampilan HTML Blogger Page




Style / CSS


please put the CSS code that has been wrapped in the following Style.. yes this is CSS code, if you want it to be loaded on the page, it must be wrapped in a Style tag like this 


  <style type="text/css">
#toc{width:99%;border:1px solid #2D96DF;margin:20px auto;
-webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
-moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);}
.labl{color:#FF5F00;font-weight:bold;margin:0 -5px;
background: #3498DB;padding:10px 0 2px 11px;
border:1px solid #2D96DF;
-webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb;
-moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block;}
.labl a{color:#fff;}
.postname{font-weight:normal;background:#fff;margin-left: 35px;margin-top: 35px;}
.postname li{border-bottom: #ddd 1px dotted;margin-right:5px}


Remember, above is the Style or CSS code that is wrapped and given a declaration that it's text/css, if it's like that it's actually safe to put it anywhere, whether it's after writing or before writing, the important thing is that the style must end in /style , that's all. .. if not then .. will be an error



Well, that's it.. Please copy the Javascript part that has been hosted on Git and connected via CDN  ( How to Convert GIT to CDN  ) and the caller's javascript feed code is below..








First of all, please give the div wrapper as well as the CSS Style caller above

  <div id="toc">

there is toc , which is the calling code for the css style, look at the style section, there is #toc ... yes that's it.. so the code name "toc" in the div, its function is to call the #toc attribute in style / css



Well this is the sitemap javascript code / sitemap..



If it's done, then we copy the script code that we put on Github, then we connect it via the CDN below..




<script src="" type="text/javascript"></script>




so I purposely separated like this, so that we can learn while on this free blog course.. yes, it's free! you can enjoy course content in the blog category that I have arranged in such a way, I have also summarized it on a special page to make it easier for friends, especially beginners,

maybe for those of you who are the same plantar as me, just remember to remember, because I also made this as my personal note if needed at any time.. hehe



Summon Feed!



After you put the javascript code just below the div tag above, after that you need to summon! hehe, you guys need to make a call using the default feed... right? yes, the default feed, so this sitemap utilizes the default facility from blogger, namely feed.. where in the javascript code above, it only calls the title link, not with description, date and especially pictures..

So only the title / collection of titles only..

<script src="/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>

that's the caller's feed code, that's the code you don't need to add a site name, because that kind of feed code will call the website feed according to where it's placed.. in this case I put it on the rahmancyber blog, meaning by default it will call the feed from rahmancyber. net

If you want to call feeds from other blogs.. just change the code to be like this

<script src=";alt=json-in-script&amp;callback=loadtoc"></script>

Did you understand? the difference? oh yes, there is a callback=loadtoc above, what is it, bro? it's a variable created in the javascript code that I hosted on github, so that variable can be changed anything.. what is clear is that it must be the same as the variable in the javascript calling sitemap that has been hosted earlier.. if it's different then .. errorrr, it doesn't work, man... this loadtoc is different from the one in the style, so it has nothing to do with it. 


Well, if so... all you need to do is...



Provide a closing div tag!


Each tag must be closed, if it is not closed it will go where and it is not clear for whom..


So if you love someone, that person has to close his heart to someone else.. if not then, it means it's confusing for you, whether he loves you too or not...


ha ha


this is the code





Well, that's the way, bro, how to make a Sitemap that, InsyaAllah, works 99.99%, and can be implemented on almost all blogs with varied templates, aka the sitemap can be run on various blog templates, whether it's responsive or not..


If now, most blog templates are already responsive, yes, I rarely find blogs with non-responsive templates.



Bro, how come this doesn't work on my blog? he said work..



Make sure you use the code



<script src="/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>



This code... because if the code for calling the second feed is the same, you have to make sure it's the same, if your blog is already using https, then use https, not http, then it will be blocked! and it's not displayed, because there are elements of an insecure network, if your blog doesn't use https, then don't use it..


Obviously... it doesn't work..






Sitemap Cover for Visitors


Here are the results from the tutorial above how to make a cool Sitemap or Responsive Sitemap at 99.99% Work.

Therefore, you can backup the code, bro, please backup the Javascript code in how to create a Sitemap for this blogger website.





That's a guide to making the latest responsive sitemap..








Actually the task of making a Sitemap does not stop there, if you are developing a blog. If the above is a sitemap to make it easier for visitors to crawl our content... then after this we will discuss about a sitemap that is intended for BOT, or commonly called GOOGLE BOT.


Why is this important?



Why Submit Sitemap to Google WebMaster Tool / Google Search Console?


If you want your posts to be fast in the Index, you need to feed them so that the GOOGLE BOT crawls your content.

For that, we need to submit a sitemap to Google Search Console / Google Webmaser Tool.


Bro, do you really have to submit everything? You don't have to use blogger, because it's been set up in such a way, so you can see, even blogs that don't use Google Webmaster can get traffic.


So why submit to Google Webmaster Tools? Let's get indexed quickly. That's the point .


How to Submit Sitemap to Google Console?  



I assume you have registered your blog property on Google Search Console. If not, please learn, How to Add New Site Properties to Google Search Console. 



Steps to Submit Sitemap

1. Please log in to your Google Webmaster Tool / Google Search Console Account
2. Next select the blog that has registered its ownership to install the Sitemap
3. Then select the Sitemaps menu, click
4. Next in the Add a new blog sitemap section, please add the following code kode

submit sitemap ke google search console (RahmanCyber.NET)



While this sitemap.xml is the sitemap, so it will index all the pages that have been posted previously, until the most updated articles when your blog is entered in this Google Search Console.



This function is to ensure that the default feed updates are indexed, so if there are new articles, they can be indexed...

(Actually, it's okay to give it too, but.. if you do a big update, for example a week after you submit the sitemap, then you need to update it, so that the bot crawls updates


If you have more than 600 articles, then you can add another sitemap, in the same way.. only the sitemap code is different... like this


make sure if you use a universal / global URL, that means it manages all subdomains in the domain.

So, you need to enter only the main URL, for example in rahmancyber net, the main thing is

like that format, just added some code above.

  Well, it should be.. if it's successful, it will be like this picture 


submit sitemap ke google search console (RahmanCyber.NET)

if it says successful, it means it has entered the indexing process, the GOOGLE BOT is crawling your page for validation to the Google Search Engine to be offered to visitors who need it.

Well, from Sitemap Optimization on Google Webmaster, this is like blogger sitemap generator, this is what makes Organic Customers / organic visitors grow on your website, all of you.

So here we learn FULL about the SITEMAP material! from Sitemap for USER/VISITOR, and SITEMAP for GOOGLE BOT.


That's all the learning material this time, it's complete for the SITEMAP discussion, which God willing, works for bloggers! hehe..

May it be useful.



Post a Comment for "How to Make a Simple Sitemap ( Step by Step ) on Blogger "

Article original from MyShorTTips Stuff. Don't Copied or Sale. Protected by LAW. Thanks for Reading.