Instaleaza Read more automat, cu poza, pe Blogger

Daca sunteti un blogger care scrie articole lungi atunci cu siguranta v-ati dori ca posturile care apar pe prima pagina a blogului sa fie prezentate doar sub forma unui sumar de cateva randuri lungime si cu un link spre articolul integral.
 Dupa cum stiti, pe Wordpress exista aceasta posibilitate, insa Blogger nu s-a ocupat deocamdata de aceasta optiune. Si daca va intereseaza asa ceva si ati cautat deja un truc care sa faca posibil lucrul acesta si pe Blogger, ati vazut cu siguranta ca sunt prezentate o gramada de astfel de trucuri pe internet. Unul mai diferit decat altul.

Tot cautand si eu, am gasit un truc care poate face asta, dar fara sa fie nevoie de interventia voastra. Si in plus pe langa faptul ca scurteaza postarea automat, tot automat creaza si o imagine mai mica din poza pe care o gaseste in articol (thumbnails). Acest truc consta in folosirea unui Javascript si in modificarea catorva elemente in modul defaul de afisare a postului pe Blogger.

Scriptul este foarte usor de personalizat dupa nevoile si dorinta noastra. El va da posibilitatea sa modificati numarul de caractere care sa apara in sumar si puteti modifica si dimensiunile imaginii. Scriptul este gasit pe acest site (Read more with thumbnails) si testat de mine pe un blog pentru teste. Vreau sa va spun ca mie mi s-a parut ca functioneaza perfect si il recomand cu incredere.

Instalarea lui mi s-a parut extraordinar de simpla, doar doi pasi trebuie sa urmati si daca doriti sa aveti Read more pe blogul vostru atunci iata ce trebuie sa faceti:

Duceti-va la pagina Aspect --> Editati Html si primul lucru pe care trebuie sa il faceti este sa descarcati o copie a actualului sablon pe care il aveti instalat pe blog. Asta este o regula de siguranta atunci cand modificati html-ul sablonului.




1. Acum primul pas. Bifati casuta de extindere a sablonului.
Cautati (Ctrl+F) acest cod: </head> si dupa ce l-ati gasit copiati codul de mai jos chiar inainte de el.

<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 230;
summary_img = 140;
img_thumb_height = 100;
img_thumb_width = 100;
</script>
<script src='http://bloggergadgets.googlecode.com/files/excerpt_min.js' type='text/javascript'/>

Pentru cei care au posibilitatea de a hosta scriptul (cel scris cu rosu) ar fi bine sa o faca, pentru a nu risca sa ramana fara latime de banda.
Inainte de a trece la pasul doi haideti sa vedem ce putem modifica aici pentru ca postul sa arate asa cum ne dorim.

summary_noimg = 300;   - schimbati pe 300 cu ce numar vreti pentru a modifica numarul de caractere care va fi afisat in cazul in care nu exista nici o poza in articol.
summary_img = 300;       - schimbati pe 300 cu ce numar vreti pentru a modifica numarul de caractere care va fi afisat atunci cand va fi generata o imagine
img_thumb_height = 100;  - schimbati pe 100 cu ce numar vreti pentru a modifica inaltimea imaginii care va fi generata.
img_thumb_width = 100;   - schimbati pe 100 cu ce numar vreti pentru a modifica latimea imaginii care va fi generata.




2. Acum ca am terminat cu primul pas, sa trecem la partea finala a trucului.
Cautati acest cod:

<data:post.body/>

si dupa ce l-ati gasit inlocuiti-l cu acesta:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<div expr:id='&quot;summary&quot; + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<div style='clear: both;'/>
<span style='padding-top:5px;;float:right;text-align:right;'><a expr:href='data:post.url' rel='bookmark'><b>Read more >></b></a></span>
</b:if>
</b:if>

In acest cod puteti modifica doar aceste 2 cuvinte Read more si puteti scrie ce vreti. Acesta este numele link-ului care va duce spre articolul intreg, si il puteti modifica cum doriti.

Asta e tot. Simplu nu?