• Posted by Uong Jowo
  • October 01, 2017
Assalamu'alaikum, friends...
Need change firstimg to background image..?

You can add some code like my template Blogsletter and Photosout to your blog.

1.Go to Edit Template HTML.

2.Find <b:includable id='post' var='post'>

3. After this <b:if cond='data:blog.pageType == &quot;item&quot;'> adding like below

<b:if cond='data:blog.pageType == &quot;item&quot;'>               
<div id='myimage' style='display:none;'>
<b:if cond='data:post.firstImageUrl'>
 <img expr:alt='data:post.title' expr:src='data:post.firstImageUrl' width='100%'/>
  <img src='...your-other-image.jpg' width='100%'/>

4. Add script below, before </body>
<script style='text/javascript'>
var getImageSrc = $('#myimage img').attr('src');
$('#BgImg').css('background-image', 'url(' + getImageSrc + ')').style.background = 'no-repeat center';

5. Place it below ,where you want.
<div id='BgImg'/>

7. Add css below before ]]></b:skin>

#BgImg{background-position:top center;background-size:cover;position:relative;}

8. About Position, you can choose: relative or absolute,like you want.

9. Save
Newer Post
Older Post

5 komentar:

if you want a template from me ? make sure that you entered your email address !