Obscure Magazine Blogger Template
Template Information
- Magazine Style
- Two Column
- Right Sidebar
- Grey
- 3 Footer Column
- Slider Gallery
- Automatic Read More
- Installed Comment Avatar
- Twitter Feature
- Social Bookmarking
- Related Posts Widget With Thumbnail picture
Installation Blogger Tutorial
This blogger template have slider feature. To install this widget, you must add a HTML/Jave Script gadget in Page Element. Be make sure to install this code.
<ul>
<li><a href="YOUR POST URL"><img border="0" alt="Twilight Movie and Book" src="YOUR IMAGE URL&zc=1"/></a>
<div class="abstitle">
<strong><a href="YOUR POST URL">YOUR POST TITLE</a></strong><span><p style="line-height:18px; ">YOUR DESCRIPTION [...]</p></span></div>
</li>
<li><a href="YOUR POST URL"><img border="0" alt="Twilight Movie and Book" src="YOUR IMAGE URL&zc=1"/></a>
<div class="abstitle">
<strong><a href="YOUR POST URL">YOUR POST TITLE</a></strong><span><p style="line-height:18px; ">YOUR DESCRIPTION [...]</p></span></div>
</li>
</ul>This is a free blogger template, but please don’t change a footer code to appreciate the designer and my works.
You like this template? Don’t forget to Re-Tweet or send this blogger template into social bookmarking site.
Best regard
Comments
I love this design, although I'm having a bit of trouble editing it because of the menus on top and the automatic "read more." Still tweaking, but in the meantime, I'll use a simpler design. I hope to get it up & running soon. 
@Kat…
when you want to remove a read more automatic, you must remove the script and change some code. Please follow this steps:
1. remove the script. Here is the script that you must remove.
<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 550;
summary_img = 450;
img_thumb_height = 125;
img_thumb_width = 200;
</script>
<script type='text/javascript'><!–//–><![CDATA[//><!--
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'…';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="background:#99995C; float:left; padding:10px; margin:0px 10px 10px 0;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//–><!]]></script>
2. Find This Code.
<div class='post-content-half'>
<div expr:id='"summary" + data:post.id'>
<p style='line-height:18px; '><data:post.body/></p>
</div>
<script type='text/javascript'>
createSummaryAndThumb("summary<data:post.id/>");
</script>
<a expr:href='data:post.url'>FULL STORY >></a>
<div class='clear'/>
</div>
3. Change with this code.
<div class='post-content-half'>
<p><data:post.body/></p>
<div class='clear'/>
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>
</div>
4. Save
I hope this will solve your problem.
Best Regard
Hi!
I want to edit photos in slide show transition; where can I find the code? if I put some pictures, more than two, in the slide show(Jave Script gadget in page element), transition not going well.. Please if you can help me..
Thanks for this template is very nice;)
Hi, can you fix the search it don't work