Be Creative On Read More and Auto Hidden

Talking about Blog will certainly not be separated with a name fragment, commonly called Readmore article or Read more,
and is located on the left and on the right above the bottom of the blog posts that aim to cut / chop off the display on the Home page :#

Now I will try to share with friends, how to move / create Read more / Read more about who is left to the right blog:

Stage One:
  • Login to ID fellow Blogger Account
  • On the Dashboard - Design / Designer Templates select Edit HTML
  • Copy and paste the following code above ]]></ b: skin>
.jump-link a{-moz-border-radius:5px;-khtml-border-radius: 5px;-webkit-border-radius: 5px;float:right;padding:2px 12px; border:none; background:#236c95; color:#FFF;font-style: normal;border:1px solid #0FF;margin-top:10px;text-decoration:none;}

.more a:hover, .jump-link a:hover{background:#000;color:#FF0;border:1px solid #F00;text-decoration:none; }
  • Save Template friends and see the results [such as the image above]
  • Read more it is a form of text,
  • Comrade can change colors as you wish

The second stage: 


In accordance with Title I of this article, now let us show creativity together in order to appear Read more Auto Hidden [would look if we put the mouse on the Post article: z and will be lost when you slide the mouse] What, what friends are interested in : O

Here's how:
  • Tick ​​/ check the radio beside Expand Widget Templates
  • Copy and paste the following code above ]]></ b: skin>
    .post .hidebego {
        display:none;
    }
    .post:hover .hidebego {
        display:inline;
        float:right;
    }
    • Next scroll down and Copy-paste following code below  <data:post.body/> or above <b:if cond='data:post.hasJumpLink'>
    <div class='hidebego'> 
    • Since the structure of different templates, and to avoid mistakes, simplenya Copas following code right above <b:if cond='data:post.hasJumpLink'> then more will be as follows:
    <div class='hidebego'>
    <b:if cond='data:post.hasJumpLink'>
          <div class='jump-link'>
    <a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a>
          </div>
        </b:if>
        </div>
    • Save Template Creation friend and it's done us on Read more



    Kalau ada yang kurang jelas pada Artikel
    » Be Creative On Read More and Auto Hidden
    diatas atau seandainya ada Link yang rusak bisa disampaikan lewat Komentar
    mudah-mudahan saya bisa segera memperbaiki


    0 komentar

    Posting Komentar


    KREASI KOLOM - © Copyright 2012 - All rights reserved
    Powered by Blogger