How to Add Border around Post Images on Blogger/Blogspot
Everybody wants their websites and it's images a bit stylish and attractive. If yo…
1
We can also label all posts in a single page in another way, i.e. SITEMAP/Table Of Contents shows post titles with separated labels and a New! text with recently published posts.
Go through this link How to create a Sitemap/Table of Contents in Blogger to create a page of All Posts Titles for your information/use.
Click here >> SITEMAP to see our Sitemap / Table Of Contents.
<div><ul id="postList12"></ul></div>Now you can put above code in two different ways anywhere in your blogger/blogspot blog. We would recommend to put the code in sidebars - left/right, that's the first way and you can put code in a html page which we can used it as a Sitemap of a blog or Archive or List of All post in a Single page.
<script type="text/javascript">
var startIndex = 1;
var maxResults = 100;
function sendQuery12()
{
var scpt = document.createElement("script");
scpt.src = "/feeds/posts/summary?alt=json&callback=processPostList12&start-index=" + startIndex + "&max-results=" + maxResults;
document.body.appendChild(scpt);
}
function processPostList12(root)
{
var elmt = document.getElementById("postList12");
if (!elmt)
return;
var feed = root.feed;
if (feed.entry.length > 0)
{
for (var i = 0; i < feed.entry.length; i++)
{
var entry = feed.entry[i];
var title = entry.title.$t;
for (var j = 0; j < entry.link.length; j++)
{
if (entry.link[j].rel == "alternate")
{
var url = entry.link[j].href;
if (url && url.length > 0 && title && title.length > 0)
{
var liE = document.createElement("li");
var a1E = document.createElement("a");
a1E.href = url;
a1E.textContent = title;
liE.appendChild(a1E);
elmt.appendChild(liE);
}
break;
}
}
}
if (feed.entry.length >= maxResults)
{
startIndex += maxResults;
sendQuery12();
}
}
}
sendQuery12();
</script>
-webkit-user-select: -khtml-user-select: none; -moz-user-select: -moz-none; -ms-user-select: none; user-select: none;Example, if you want to disable text selection in Blogger posts, then the code is:
.post {-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: -moz-none; -ms-user-select: none; user-select: none;}This CSS will disable text selection on the element and all it's children. It should work on Firefox, Safari, Chrome and IE10+. For IE9 and below, use onselectstart='return false' event handler, see II).
.post code {-webkit-user-select: text; -khtml-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text;}II) DISABLE DRAG AND DROP:
ondragstart='return false'To disable drag and drop inside Blogger posts, follow these steps:
<divid="RecentComments"class="dsq-widget"><scripttype="text/javascript" src="http://bloggeraddict.disqus.com/recent_comments_widget.js?num_items=5&hide_mods=0&hide_avatars=0&avatar_size=32&excerpt_length=50"></script></div>
Enjoy this high-quality and fast-loading widget from Disqus :)
.dsq-widget ul.dsq-widget-list {
padding: 0;
margin: 0;
text-align: left;
}
img.dsq-widget-avatar {
width: 32px;
height: 32px;
border: 0px;
margin: 0px;
padding: 0px 3px 3px 0px;
float: left;
}
p.dsq-widget-meta {
clear: both;
font-size: 80%;
padding: 0;
margin: 0;
}
li.dsq-widget-item {
margin: 15px 0;
list-style-type: none;
clear: both;
}
span.dsq-widget-clout {
padding: 0 2px;
background-color: #ff7300;
color: #fff;
}
a.dsq-widget-user {font-weight: bold;}
a.dsq-widget-thread {font-weight: bold;}
table.dsq-widget-horiz td {padding-right: 15px;}
.dsq-widget-comment p {display: inline;}
On-page markup enables search engines to understand the information on web pages and provide richer search results in order to make it easier for users to find relevant information on the web. Markup can also enable new tools and applications that make use of the structure.Getting featured in Google Knowledge Graph