The idea is simple, Blogger provides Dynamic View feature on a separate URL on your site. So we will use that URL to load the Dynamic View in an iframe. Very simple, right.
Dynamic View feature of Blogger provides a lot of awesome transition effects and many filters in many layouts for listing content from your blog. We take its advantages to create a cool site map page for your Blogger / Blogspot websites.
The idea is simple, Blogger provides Dynamic View feature on a separate URL on your site. So we will use that URL to load the Dynamic View in an iframe. Very simple, right?
Here is Demo of Blogger Site Map:
Blogger Site Map Code:
At first, create a static page on your blog and edit it in HTML mode.
Next, you will need to replace “YOUR_DOMAIN” text in below code then copy and paste it into your page content (in HTML mode).
[post_ads]Code Box:[<style type="text/css">
.sbis {
overflow: hidden;
position: relative;
height: 565px;
margin: 20px 0 40px 0;
}
.sbis iframe {
display: block;
width: 100%;
height: 680px;
margin-top: -115px;
margin-left: -10px;
padding-right: 10px;
}
</style>
<div class="sbis">
<iframe src="https://YOUR_DOMAIN/view/flipcard"></iframe>
</div>]
You can also replace “flipcard” in the code to ONE of the following style to change the way of your site map layout:
- classic
- magazine
- mosaic
- sidebar
- snapshot
- timeslide
Notes: The dynamic view iframe will work on your blog if all of the following are true:
Your blog is public. Your readers don’t need to sign in to view your blog.
- In the Dashboard > Settings > Basic > Blog Readers tab, you need to set your blog read to Public.
- Your blog has feeds fully enabled. In the Dashboard > Settings > Site feed tab, you have enabled either Full or Jump Break for your Post Feed.
- You have not disabled dynamic views. In the Dashboard > Settings > Formatting tab, the option for Enable Dynamic Views is set to Yes.
Welcome all comments for improving the code better. Thank you very much.
COMMENTS