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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAX8Y3jfa6OjG4boJxcMmF2ndD0zumUlhMYwAAySWzFIv2KkkK5EnNp9On0e0k_dnOLA5e2JwN9Kxj_D52IlDL9i8ShPETmyHJNFw4zqDnzmgiK5LGXnQyOdi3HzV1S7aQoRKAEe5BUio/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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHA4EgZOKG5wdPCm5nOZMgAZynQwLZEzxNhiXcZmXL0sYlMi0A0uI5GWNK8ejxFLGbvat6XoIiFicBgh-PIcRI_aC7zZaFTncM7IsUoeBQG3FFpNGr0-Co-e3B42sq9I0TDwy0bb3F3l8/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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-aZhMvU85lV71oXTpPOAAX2G-yVsEw5pe6joX2WvANhaFLslb-MQSwv4V8cQX7LC00GuCUceM2o5Dru6cV8Ml2N8MTZPUJepJVVXk9VXnZ9Ps4hWwzR3wC-irJwbbkkjW__yMMGtO2Eg/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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcoFfbSN1L73TojUQrGs8ciaxooJW_rF98Up8qFxxMGd40S5WU3kocoXB7NSPGsY9cJK5_qQbCZbXx8587cLrjrIgPe53X3GF62XZoBga-ZtDCsUKb-BBhBAfUDaMUuK_1GjjqH5yplYg/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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHDg2vUYDDDg2DrU1supRFSAdum-clpYvM8jq3PoE5eOSQYho9KClGIONI73gJWvjNIBPCucqHtJiSvn6HiHjgBWPXfnVfIvEOi6PD0k6h7MC3a289l09PBjlgebZUdEQditmgDiIXf9Y/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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhE0tCRgIzvPg5kRoSv-ZZQ_28S4-NzcktKj8DtSXuoR9FKgZGQQ0rwQt3OXI46fNFJoiCCtdG0N9PNlFKmKiFxxIHznKUbFZ5HdXyyH3isTvI8uuPcJNjabgk2q6c_UsopObnZCqBmtyc/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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6ub_0BOlwHOf0H1b4p-9tPDTgzq_2i5hyphenhyphenxiDts37ibZgYafTqCrhl-DEqCBK2mNkAbrnMHqR5CSgfw-8l4hDFmVVBZXEsWAWpzZNYlWnRsVR1PhaTZdlyq-Iw4QpJ84ld8ns6KSM3k8w/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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBu2wM6Oo70bfaIiPa5ghc4pQEX-CKNWQXYULORaWf1AsT1asy2q3N9P4XV49iksLf_39qey0u0xdrbTuSWUnE97bUb71SO66WePbZ1hDLed3nRZHLSeoutolloRuCgTWArYdruIjrWR8/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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyK0Q1pNgXOOOZnhFHU_22oRjFdGrX-xrnO4nXez0q_5VGKh2ODayMZABC-J6G180V3a0UqEZcjUgpJcdkuDGd9LiBGCwl4CYC8KgAr1ffR_aXNnVFmRl18rhODOew34M7Q2mTSaWVxrA/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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PnvPqUmMcUERElwJWEOrX4hJkn0I-y30WYJ5BynZoijm9Pc9h_rcenV0Qs1zvlr7XeF_ewKBN_Oz9UJMdSj6CHB72O9zJps0j9eB6dbWZ3ElQI794fZ4Hetm8rIkKsfqfJdroJ8dPRc/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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGXqg16qJHh7JBd5HOcs-jklYKL6JtFwZHWXgarfHAozI8Rnc9sdXrJ1odBkgdiVrs8HO059ml-YXxYwI0ZJtZ28WV-SkalEVUPFKT97Luusge1AoF89AOkvOCUHc3SjNk5RjhhpEZXS0/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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUBAm5UJMLbsYv0SFC-T4w5Xid7BZvvC_wccLXCVy-dcF7m1BdAlyLvvDwoOPoIej9hh41dqSDIgsKXS-gpn8871h93tZWJaDT7y0FwiljoOTnoA3m-6lk7cDle5OJBIEZkES40bOsgzA/h120/%25D0%259A%25D0%25BD%25D0%25BE%25D0%25BF%25D0%25BA%25D0%25B0+%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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEQfrcFLtV-SvjQLXOP4EAxEKiSbnjfVVamEfU3O9fvcVHGz7onZBF9Um-p88IqCx2hjKFtFjA558QvGGxTqetZfOWpFFceZdKsZPH-s1KPww8vS_MJk8hu9S-s0-MzuBIJp0EojPCabA/h120/%25D0%25BA%25D0%25BD%25D0%25BE%25D0%25BF%25D0%25BA%25D0%25B0+%25D0%25B4%25D0%25B0%25D0%25BB%25D1%258C%25D1%2588%25D0%25B5+%25D0%25B4%25D0%25BB%25D1%258F+%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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfHfqirXHPOUGB9iS_5uklnCw55LX_gtOrXRJRkulFvVMnEym4oXPuEpnA_cZ8_QRgL9KpXFnJpW1iIsK8GF1SBBLg_HVlAflhY1aFJPlT3n6jQ-8CHtoblNEATodMbGrk8tbInGUamxM/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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNVXnnNdC43hFeH_sJAi4hW29I75bL8Y1MekrcjUuaqN2-URYOLlIo0l2cTQM8jFIO6fwaSVJAmJSmwH-BfzkkdAI_UER7y8Xd1oDeE7NMJ21Cb1MBD-ZkHBvn_Q4BM0WHAhzmZAlLC0Y/h117/podrobnee_red2.png" /></A>
</DIV>
</b:if>

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

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