xbloggertricks: page

Showing posts with label page. Show all posts

How to fix date display "Undefined" on your blogger page

To fellow bloggers who like changing the template, may have experienced this problem. Date not appear on your blog page or it says "Undefined" like this:

Here are my tips for you to say, to display the date with the perfect:

* Login to your Blogger Dashboard
* Select Settings, click the Format tab
* In Timestamp Format select the "Day, Month, Year" and then Save (see sample below)

* Finished, then the result will be as below:

Good luck..!

How to make Related Post in Blogspot or Blogger

Related Post consists of many versions. But the goals remain the same ie display related articles by categorie or labels of the text or post we are reading. And this is usually helpful pageview number (the page in read) on our blog, especially for visitors who want to dig deeper into the other articles that we write.

For good layout "Related Posts" at the store the exact bottom of the article, or a little distance from the article.

* Attention
And the thing to remember is this related Post will run or be seen if the article you have the same labeled / categorie / tag from several papers.

Here are the stages to add Related Posts script into Blog Templates.

1. Login / enter to your account Blogger.com.

2. On page dasboard into Layout (layout), select the Edit Html tab.

3. Then mark / check the box on the "Expand Widget Templates"

4. After that place the following script under the tag ]]></ b: skin>

<script type='text/javascript'>
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;
break;
}
}
}
}
function removeRelatedDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains(tmp, relatedUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];
}
}
relatedTitles = tmp2;
relatedUrls = tmp;
}
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;
}
function printRelatedLabels() {
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;
}
document.write('</ul>');
}
//]]>
</script>

5. Save template
6. Then find this section and add the red code as below

<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'/>

<b:if cond='data:blog.pageType == "item"'>

<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=10"' type='text/javascript'/>

</b:if>

</b:loop>
</b:if>
</span>

7. Now find the code lines following a post-footer.
<div class='post-footer-line post-footer-line-3'>
Then input this script underneath.

<b:if cond='data:blog.pageType == "item"'>
<div class='related-posts'>
<h4>Related Post:</h4>
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>
</div>
</b:if>

8. Save the changes (save the template).

If you want to give the style or styles on display this Post Related Widgets. we could add to his Css pages, the following script, before the tag ]]></ b: skin>

.related-posts h4{
margin: 0 0 0 10px;
padding: 0 0 0;
font-size: font size;
color: #value color;
}

To List

.related-post ul{
margin: 0 0 0;
padding: 0 0 0;
list-style-type:none;}
.related-posts li{
margin: 0 0 0;
padding: 2px 0px 0px;
list-style-type:none;
font-size: font size;}
.related-posts li a{color: #value color}
.related-posts li a:hover{color: #value color; text-decoration:none;}

Hopefully helpful..!

How to Make Columns Above Post

Often I find advertising or anything above the posting, but it looks less effective and less nice views like the picture below :

Try to compare it with the following image:

It is fitting function above posting column in the figure 1 and figure 2 the same which to advertise, but the value of its beauty more visible second image does not damage the beauty of templates.

For those of you who are interested in making a column above the posting column follow the steps below:

1. Please log in to Blogger with your ID.
2. Click Layout
3. Click the Edit HTML tab.

4. Click on Download Template More.

5. Please Save the template first, this is meant to reduce risk in the event of an error when editting the template, you still have back up data to restore it as before.

6. Copy paste following code above the code of ]]></b:skin>

.topcolumn{
width: 578px;
padding:10px 0px 10px 10px;
background:#fff;
margin:0px 0px 10px 0px;
text-align:left;
border:1px solid #C0C0C0;
}
.topcolumn .widget{
}

7. Copy paste following code right under the code <div id='main-wrapper'>

<b:section class='topcolumn' id='topcolumn' preferred='yes'/>

8. Click Save Template button

The next step, please click Page Element tab, then you will see the layout template to be like the example picture below:

Good luck!

Total Items:
SubTotal:
Tax Cost:
Shipping Cost:
Final Total:

How to fix date display "Undefined" on your blogger page

How to make Related Post in Blogspot or Blogger

How to Make Columns Above Post

Shopping Cart

Most View Product

Labels

CB Blogger Lab

JASA SEO CB

CONTOH BLOG

HOODLES

JACKETS & SUIT

SPORT SHOES