15 Красивых примеров - Кнопка Читать далее для Blogger

Давно хотел показать примеры кнопки Читать далее подробнее, и помочь вам сделать ваш Blogger более удобным. Я собирал 15 примеров для кнопки читать дальше и подробен, все приемы хороши и красивы по своему, я не поставил по списку лучших и плохих попробуйте все примеры и выбирайте себе самую удобную кнопку далее.



Я выбрал самый простой вариант, и так начнем:

1. Дизайн → Изменить HTML
2. Ставим галочку на «Расширить шаблоны виджета»
3. С помощью поиска «Ctrl+F» находим в шаблоне <data:post.jumpText/>
4. Вместо этой строки вставляем один из ниже указанных вариантов.

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-pTBqU68dOpk/V1R_QOf5srI/AAAAAAAAAag/ACBHFsL8QAAKxkTNvd2MlYRS7yaT-bm4gCLcB/h120/0_beff1_d14ee026_S.gif" /></A>
</DIV>
</b:if>

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-EqgxpPpoZ9I/V1R_QK_CceI/AAAAAAAAAao/OTsOm6p_XZkc-OhO5bWUIaRUeXzFVLGeQCLcB/h120/0_beff8_fe2f7fd0_S.png" /></A>
</DIV>
</b:if> 

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-CNRwVWbTPvY/V1R_QRBWyoI/AAAAAAAAAaw/oe-EsSAaAFIGB7ExcFeUQRcM5KIYlnO3QCLcB/h120/6_1_%25D0%25BA%25D0%25BD%25D0%25BE%25D0%25BF%25D0%25BA%25D0%25B0_%25D0%25B4%25D0%25B0%25D0%25BB%25D0%25B5%25D0%25B5.png" /></A>
</DIV>
</b:if>

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-MLCSxpmOr64/V1R_QAxelkI/AAAAAAAAAak/2QM3WJjqmgovnjAtOmc6QJ8gRh6VW5figCLcB/h65/12.png" /></A>
</DIV>
</b:if>

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-Jtu5BXCsLCY/V1R_QeBnzTI/AAAAAAAAAa0/24bKnG9t2WkTBxgD_xkD7H-rRbvKP_SVwCLcB/h105/but1.png" /></A>
</DIV>
</b:if>

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-Tec216iUfj8/V1R_QkAR_bI/AAAAAAAAAa4/B2JO1W4qycoPy0ZwLlaPSpB5pbq-UD_-gCLcB/h116/but3.png" /></A>
</DIV>
</b:if>

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-wiyuO9bfvRE/V1R_Q3QTnZI/AAAAAAAAAbA/-Fi8xE7in581krxaN518uBnFH7M2zXF2ACLcB/h83/button.png" /></A>
</DIV>
</b:if>

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-6cM2sPOBHfQ/V1R_Q4G_Y6I/AAAAAAAAAbE/gBXtzSR9cBA05n3qIUB3rYkNRj7ae2_ngCLcB/h80/cooltext1609543539.png" /></A>
</DIV>
</b:if>

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-dzj3PtEIsi4/V1R_Q3veCDI/AAAAAAAAAbI/OC4-ghSCn4AaFxjsFTQHlp7a5TG0_w8vgCLcB/h115/dalee.png" /></A>
</DIV>
</b:if>

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-3VcAsX58zFI/V1R_RLfGrZI/AAAAAAAAAbQ/mVxRHzSSCSMnJ9BhvTZfG8rSKISGt4DiQCLcB/h87/oteli-hurgady.png" /></A>
</DIV>
</b:if>

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-EKX_jlVMGx0/V1R_RNywU0I/AAAAAAAAAbc/ahfwoIAjQk8s_WY8D7FQ4PDDOUi7QM5rACLcB/h116/read.png" /></A>
</DIV>
</b:if> 

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-P_rDZhtKh88/V1R_RZ5VM6I/AAAAAAAAAbY/pavmKtUF8eY6c-oAgSll9A8R3CGV8mDDgCLcB/h120/%25D0%259A%25D0%25BD%25D0%25BE%25D0%25BF%25D0%25BA%25D0%25B0%2B%25D0%25B4%25D0%25B0%25D0%25BB%25D1%258C%25D1%2588%25D0%25B5.png" /></A>
</DIV>
</b:if>

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-zDvuMDj8EA8/V1R_Roqg0jI/AAAAAAAAAbo/qtPDNNtsf3IEZLTUJ701Pmb1YICGgrmmgCLcB/h120/%25D0%25BA%25D0%25BD%25D0%25BE%25D0%25BF%25D0%25BA%25D0%25B0%2B%25D0%25B4%25D0%25B0%25D0%25BB%25D1%258C%25D1%2588%25D0%25B5%2B%25D0%25B4%25D0%25BB%25D1%258F%2B%25D0%25B1%25D0%25BB%25D0%25BE%25D0%25B3%25D1%2581%25D0%25BF%25D0%25BE%25D1%2582.png" /></A>
</DIV>
</b:if>

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-dwpokYvP87A/V1R_RfYm8lI/AAAAAAAAAbk/k2rXz5o35QMvwNK20KvWVp7AJSWlgIUHgCLcB/h60/%25D0%259A%25D0%25BD%25D0%25BE%25D0%25BF%25D0%25BA%25D0%25B0_%25D0%2594%25D0%25B0%25D0%25BB%25D0%25B5%25D0%25B5.png" /></A>
</DIV>
</b:if>

<b:if cond='data:post.hasJumpLink'>
<DIV class='jump-link'>
<A expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><img border="0" src="https://lh3.googleusercontent.com/-8qAT9nf14oY/V1SEZ2qufTI/AAAAAAAAAb4/76RKp90sfqAsivv4opGictsgJOeCLBkNQCLcB/h117/podrobnee_red2.png" /></A>
</DIV>
</b:if>

Вот и всё. У вас на Блоггер уже есть красивая кнопка читать далее, Картинку, выделенную красным, можете поменять на свою, если конечно у вас есть такая картинка далее.

15 примера кнопки читать далее.