Showing posts with label Blogspot Tutorial. Show all posts
Showing posts with label Blogspot Tutorial. Show all posts

Sunday, January 24, 2010

Sharing is Sexy Widget

Sunday, January 24, 2010 3 comments

sharingissexy

I have installed the sharing is sexy widget in this template, but if you want to put it on your other blog, I provide a tutorial for you. As we know, a blog will be famous soon if spread over all the social bookmark sites. And one one way to update your article on the social bookmark sites, by installing the sharing is sexy widget.

But first, please change your feedburner ID

  • Login to blogger, click on Edit HTML, Click Expand Template Widgets
  • Then look for the code : <li class='sexy-syndicate'> <a href='http://feeds2.feedburner.com/blog-zone' title='Subscribe to RSS'/> </ li>
  • Replace the red text (blog-zone) with your feedburner ID
  • Save Template

To install the sharing is sexy widget in your other blog, please follow the steps below :

  • Login to blogger, click on Edit HTML, Click Expand Template Widgets
  • Put the following code after ]]></b:skin> 

<style type='text/css'>

div.sexy-bookmarks { height:54px; background:url(http://sites.google.com/site/dodyfarial/image/sharing.png) no-repeat left bottom;position:relative; width:540px }

div.sexy-bookmarks span.sexy-rightside { width:17px; height:54px; background:url(http://sites.google.com/site/dodyfarial/image/sharing.png) no-repeat right bottom; position:absolute; right:-17px }

div.sexy-bookmarks ul.socials { margin:0 !important;padding:0 !important; position:absolute; bottom:0;left:10px }

div.sexy-bookmarks ul.socials li { display:inline-block !important; float:left !important; list-style-type:none !important; margin:0 !important; height:29px !important; width:48px !important; cursor:pointer !important; padding:0 !important }

div.sexy-bookmarks ul.socials a { display:block !important; width:48px !important; height:29px !important;f ont-size:0 !important; color:transparent !important}

.sexy-furl, .sexy-furl:hover, .sexy-digg, .sexy-digg:hover, .sexy-reddit, .sexy-reddit:hover, .sexy-stumble, .sexy-stumble:hover, .sexy-delicious, .sexy-delicious:hover, .sexy-yahoo, .sexy-yahoo:hover, .sexy-blinklist, .sexy-blinklist:hover, .sexy-technorati, .sexy-technorati:hover, .sexy-facebook, .sexy-facebook:hover, .sexy-twitter, .sexy-twitter:hover, .sexy-myspace, .sexy-myspace:hover, .sexy-mixx, .sexy-mixx:hover, .sexy-script-style, .sexy-script-style:hover, .sexy-designfloat, .sexy-designfloat:hover, .sexy-syndicate, .sexy-syndicate:hover, .sexy-email, .sexy-email:hover { background:url(http://sites.google.com/site/dodyfarial/image/sexy.png) no-repeat !important }

.sexy-furl { background-position:-300px top !important }

.sexy-furl:hover { background-position:-300px bottom !important }

.sexy-digg { background-position:-500px top !important }

.sexy-digg:hover { background-position:-500px bottom !important }

.sexy-reddit { background-position:-100px top !important }

.sexy-reddit:hover { background-position:-100px bottom !important }

.sexy-stumble { background-position:-50px top !important }

.sexy-stumble:hover { background-position:-50px bottom !important }

.sexy-delicious { background-position:left top !important }

.sexy-delicious:hover { background-position:left bottom !important }

.sexy-yahoo { background-position:-650px top !important }

.sexy-yahoo:hover { background-position:-650px bottom !important }

.sexy-blinklist { background-position:-600px top !important }

.sexy-blinklist:hover { background-position:-600px bottom !important }

.sexy-technorati { background-position:-700px top !important }

.sexy-technorati:hover { background-position:-700px bottom !important }

.sexy-myspace { background-position:-200px top !important }

.sexy-myspace:hover { background-position:-200px bottom !important }

.sexy-twitter { background-position:-350px top !important }

.sexy-twitter:hover { background-position:-350px bottom !important }

.sexy-facebook { background-position:-450px top !important }

.sexy-facebook:hover { background-position:-450px bottom !important }

.sexy-mixx { background-position:-250px top !important }

.sexy-mixx:hover { background-position:-250px bottom !important }

.sexy-script-style { background-position:-400px top !important }

.sexy-script-style:hover { background-position:-400px bottom !important }

.sexy-designfloat { background-position:-550px top !important }

.sexy-designfloat:hover { background-position:-550px bottom !important }

.sexy-syndicate { background-position:-150px top !important }

.sexy-syndicate:hover { background-position:-150px bottom !important }

.sexy-email { background-position:-753px top !important }

.sexy-email:hover { background-position:-753px bottom !important }

</style>


  • Then look for the code <data:post.body/>
  • If you are using read more, there will be two <data:post.body/> code. Put the following code after the first <data:post.body/>

<div class='sexy-bookmarks'>

<ul class='socials'>

<li class='sexy-delicious'><a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-digg'><a expr:href='&quot; http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-technorati'><a expr:href='&quot; http://technorati.com/faves?add=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-reddit'><a expr:href='&quot; http://www.reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-stumble'><a expr:href='&quot; http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-designfloat'><a expr:href='&quot;http://www.designfloat.com/submit.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-facebook'><a expr:href='&quot; http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-twitter'><a expr:href='&quot; http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-furl'><a expr:href='&quot; http://www.furl.net/storeIt.jsp?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

<li class='sexy-syndicate'><a href='http://feeds2.feedburner.com/your feedburner ID' title='Subscribe to RSS'/></li>

<li class='sexy-email'><a expr:href='&quot; mailto:?subject=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

</ul>

<span class='sexy-rightside'/></div>


  • Save Template.

Replace red text with your feedburner ID, if you do not have, you can register your blog in feedburner. Good luck !


read more

Related Posts

0 comments

related_posts_widget Related Posts are posts which are in a label or category. Using the related posts to facilitate visitors to see what articles are in a label with other articles, and will most likely be in the clicks by visitors, because it was right under our posts.
Actually, I've put the code related posts on this template, but if you want to put this code in your blog, then I would give this guide below.

The following short tutorial :

  1. Log in to Blogger.
  2. Click Layout.
  3. Click the Edit HTML tab.
  4. Then click the Expand Widgets Templates.
  5. Find the code like this : <p><data:post.body/></ p> 

    or if the confused press Ctrl + F and type the following code :

    <data:post.body/>
  6. Then place the following script after the code <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>
<div class='widget-content'>
<h3>Related Posts</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 7;
maxNumberOfPostsPerLabel = 7;
maxNumberOfLabels = 3;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;data2007&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>
Don’t forget to Save Template.
read more

Read More

0 comments

ajax-loader6 As we know, bloggers have support read more. But still we have to divide the posts that will appear first and which will appear whole. In this template, I've put read more. If you want to use the blogger red more , you can delete the blue read more (readmore) you can see in this post.

Log in to Blogger, then on the Edit HTML page, click the Expand Widget Templates.

I. If you want to use blogger read more

  • Click Layout, then click Edit in the Blog Posts

    blog post

  • You can change the text “Read More“ to “Read Full Story” or whatever you want.

    read more1

Search for the word “read more” or be with CTRL + F and type in the word “read more”, you will see the following code :

<span class='rmlink' style='float:right'><a expr:href='data:post.url'><img alt='read more' src='http://lh5.ggpht.com/_7Y9pl24WpQY/SuM7b-deOLI/AAAAAAAAB_4/PKYOsvyuCdc/readmore_thumb%5B2%5D.png?imgmax=800'/></a></span>


Delete the following code : 

<img alt='read more' src='http://lh5.ggpht.com/_7Y9pl24WpQY/SuM7b-deOLI/AAAAAAAAB_4/PKYOsvyuCdc/readmore_thumb%5B2%5D.png?imgmax=800'/>


The result will be as follows :

<span class='rmlink' style='float:right'><a expr:href='data:post.url'></a></span>


Save Template.

II. If you want to use read more from this template

Very simple, in writing the article click edit html, you just have to insert the code <span class="fullpost"> on the post you want to cut (the article will appear first). And closing the article with </span>

example :

post


read more

Monday, October 5, 2009

Place Meta Tag in Blog

Monday, October 5, 2009 0 comments

All know that meta tag are very important role in our position on search engine. If you wrong install a meta tag code, the blog will be difficult to read by google, blog and consequently we can not be the best page in the search engine.

Meta tag itself is the identity of our blog. There are many ways in which I teach senior by about the meta tags in your HTML code blog, but I will try to help you make that have not yet know how to install meta tag on the blog.

Does not need high-level techniques to make the meta tag, is very easy ..
To install a meta tag, you need some HTML code.

Following the steps

  • Login to Blogger.
  • Go to the Edit HTML page.
  • Find the following code <title><data:blog.pageTitle/></title>
  • Replace the code with the code below

<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>

  • Place the code below after the code above

<meta expr:content='data:blog.pageTitle + " - Your blog description here "' name='description'/>
<meta expr:content='data:blog.pageTitle + ", Keyword 1, keyword 2, keyword 3, .... "' name='keywords'/>
<meta content='INDEX, FOLLOW' name='ROBOTS'/>

  • For example like this:

<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>

<meta expr:content='data:blog.pageTitle + " - Your blog description here"' name='description'/>
<meta expr:content='data:blog.pageTitle + ", Keyword 1, keyword 2, keyword 3, .... "' name='keywords'/>
<meta content='INDEX, FOLLOW' name='ROBOTS'/>

  • Do not forget to Save Template after place meta tag.

Very easy, please try !


read more

 

Recent Posts

Website counter
free counters

New Camera's Product

  
Copyright © 2009 Blue Light
Blue Light Template designed by Dody Farial and XML Coded by Blog Zone