Cayman Islander | Diary of a Freelance Programmer traveling the world

Cayman Islander's blog - Diary of Freelance Programmer

Jak upravit a kde najít Free Templates pro blog na Blogger (Blogspot) portálu

Blogger.com - Free Blog for bloggersPár bloggerů se mě už několikrát ptalo, jak se mi líbí ten Free hosting na Blogger.com, kde provozuji tento aligátorský blog.

Na anglických stránkách lze najít skoro jakýkoliv tip jak upravit šablonu nebo design nebo jak cokoliv na Blogger.com (Blogspot.com) vyřešit, zde tedy uvádím jen nějaké základní tipy, co by mohl někdo využít.

Jak jsem spokojen s Blogger.com na Blogspot.com?

Rozhodl jsem se pro Blogger.com hlavně z toho důvodu, že hodně mých známých z ciziny a hodně odborníků, jejichž blogy denně čtu, tento systém dlouhodobě využívá. Někteří používají standardně nabízené šablony, další si upravili nebo vytvořili vlastní, příp. za použití Blogger.com technologie publikují na vlastní doméně.

Když si vezmu, že blogovací systém na Blogger.com je zdarma, umožňuje skoro cokoliv, od WYSIWYG editoru (nevyužívám), až po přímou publikaci v HTML (preferuji), že nevyžaduje extra instalaci a konfiguraci na vlastním hostingu, jak je nutno např. v případě Wordpress blogů, tak jsem docela spokojen.

(Žádná instalace, žádná starost s hostingem, žádná reklama jak na některých českých napodobeninách blogovacích systémů.)

Komu by snad vadila adresa blogu ve tvaru xyz.blogspot.com, tak si může zaregistrovat vlastní doménu kdekoliv jinde a nastavit přesměrování na Custom Domain Name. Komu by vadila ta "omezená" nabídka zabudovaných šablon, tak si může stáhnout nějakou ze stovek Free templates dostupných pro Blogger.com zdarma.

Co se mi líbí, tak je podpora jazykových verzí, neboť blogovací prostředí si můžete přepnout asi do 30 jazyků, od češtiny, slovenčiny, němčiny, francouzštiny, až po arabštinu nebo čínštinu. Myslím, že ty milióny autorů blog stránek z celého světa jsou docela slušnou zárukou, že Blogger.com jen tak nezmizí ze světa.

Dalším významným důvodem, proč jsem zvolil Blogger.com, bylo i to, že patří společnosti Google (záruka podpory a dalšího vývoje) a že přímo Google na něm provozuje všechny své oficiální firemní blogy s informacemi o všech svých službách, např.:

- Google Blog
"Insights from Googlers into our products, technology, and the Google culture."

- Google Webmaster Central Blog
"Official news on crawling and indexing sites for the Google index."

- Google Website Optimizer Blog
"The most up-to-date product news, industry insights, and testing strategies."

Pár věcí se mi sice nelíbí, např. ten starý komentářový systém je dosti uživatelsky nepříjemný, ale je mi jasné, že každá změna a každé zlepšení trochu trvá, proto jsem trpělivý. Všechno je jen otázkou priorit, což chápe každý, kdo někdy něco vyvíjel a měl plno požadavků na zlepšení.

Navíc, hodně věcí se zlepšilo, jak je vidět z testovací verze blogger systému na Google Blogger in Draft, kde je možno si nějaké novinky vyzkoušet online i přímo s vlastním blogem.

Detailní popis všech novinek a změn obsahuje oficiální Blog for Blogger in Draft, kde naposledy uvedli do provozu tu úchvatnou funkci Scheduled Posts, která už nyní v ostrém provozu umožňuje odložit publikování příspěvků na pozdější naplánovanou dobu.


Základní tipy pro bloggery na Blogger.com:

1. Jak na české znaky v URL stránky příspěvku?

Při publikování nového příspěvku na Blogger.com je z názvu příspěvku (Title) sestavena URL adresa, kdy jsou ale odstraněny všechny speciální znaky a spojky. Také česká diakritika je vynechána a URL pak má trochu nepěknou podobu.

Příklad:
- Název příspěvku s češtinou: "První místo ve vyhledávači"
- Výsledná URL stránky: prvn-msto-ve-vyhledvai.html

Řešení:
Dosud jediná cesta je publikovat ve dvou krocích a nejprve do názvu příspěvku napsat celý název bez háčků a čárek, tj. z příkladu je nutné do Title napsat: "Prvni misto ve vyhledavaci" a příspěvek publikovat. Tím se vytvoří správná URL se všemi znaky bez diakritiky. Pak hned stačí dát Edit a Title opravit na kompletní české: "První místo ve vyhledávači" a znovu publikovat daný příspěvek.

(Tohle je nepříjemnost, která mě docela štve. Už jsem to také milému gůglu reportoval, ať zavede automatickou konverzi diakritiky, tak snad to co nejdřív opraví.)

Update 11-02-2009:

Dle dnešní zprávy na českém Google blogu je vynechávání českých znaků opraveno a diakritika je v permalinku správně nahrazena znaky bez háčků a čárek při publikování příspěvku. Mockrát děkuji, milý Google.


2. Jak odstranit horní navigační lištu na Blogger.com?

Každý, kdo navštívil nějaký blog na Blogger.com, tj. na doméně Blogspot.com, tak si asi všimnul u mnoha blogů, že stránky obvykle nahoře mají "Navbar" lištu, která se defaultně zobrazuje na každém novém blogu nahoře a slouží pro rychlé přihlášení k účtu, či k hledávání nějakého textu na blogu.

Příklad:

Example of Blogger NavBar on Top

Ta navigační lišta je ale jen pozůstatek z minulosti, než Google blogovací portál koupil, takže málokdo ví, že není problém tu navigační lištu odstranit a že to neporušuje žádné licenční podmínky provozu blogu na Blogger.com, jak je vidět z mnoha příkladů, např.:

- How to Hide Blogger Navbar in New Blogger (Digital Inspiration)
"The old blogger as well as beta blogger's policy page do not mention anything about removing the blogger navigation toolbar."

Řešení:
Upravte si template stránek (v menu Layout - Edit HTML) a do HTML přidejte hned pod <body> tag následující kód pro Disabling Blogger NavBar (kdo neumí zálohovat stávající template, tak ať se do nějakých úprav HTML raději ani nepouští):

<body>
   <!-- Disabling Blogger NavBar -->
   <style type='text/css'>
     #navbar-iframe {display:none;}
   </style>

(Je snad každému jasné, že Google nepotřebuje nějakou extra reklamu v podobě té horní lišty a že dostatečnou reklamou je snad i ta podoba domény s blogspot.com ve jméně.)


3. Jak opravit TITLE stránky, aby neobsahoval název blogu?

Od počátku blogování mi vadilo, že TITLE každé stránky je generován ve formátu: "Název blogu: Název příspěvku", což mělo za následek špatné pozice ve vyhledávačích a zobrazování nerelevantních reklam Google Adsense. Opravdu nebylo řešení jak to opravit.

Až teprve nedávno chalani dobří z Google doplnili další sadu globálních proměnných (blog.pageName), co jdou nyní využívat v Blogger templates a je tak možno generování TITLE stránky upravit na smysluplný formát: "Název příspěvku".

Řešení:
Upravte si template stránek (v menu Layout - Edit HTML) a v HTML najděte a nahraďte starý kód novým kódem s použitím nových template proměnných.

1. Starý kód: <title><data:blog.pageTitle/></title>
2. Nahraďte novým kódem:

<b:if cond='data:blog.pageType == &quot;index&quot;'>
   <title><data:blog.title/></title>
<b:else/>
   <title><data:blog.pageName/></title>
</b:if>

Místo statického TITLE se doplnila podmínka IF, která testuje (první řádek) zda se jedná o hlavní stránku blogu (index), pak použije v TITLE název blogu <data:blog.title/>, pro všechny ostatní stránky (else) se použije v TITLE název příspěvku / stránky <data:blog.pageName/>.


4. Kde najít nějaké lepší Free Templates pro Blogger.com?

Kdo nemá čas nebo náladu na vytváření vlastního template, tj. vlastní šablony v uživatelském formátu a s vlastní grafikou, tak může využít mnoha Free Templates dostupných ve formátu vhodném pro blogy na Blogger.com ke stáhnutí zdarma.

Nějaké základní linky na Free Web Templates jsem již publikoval, zde tedy ještě něco extra pro Blogger.com, kdy použití je stejně jednoduché jako změna default šablony integrované na portálu (menu Layout - Pick New Template) a některé "free" šablony jsou docela profesionální:

- Blogger Templates (Classic Templates - Old)
- Blogger Templates (XML Templates - New)
- Free Blogger Templates (eBlog Templates)
- Free Blogger Templates from Amanda (Blogger Buster)

Příklady:

Free Template for Blogger.com

Free Template for Blogger.com


Tohle snad na úvod, jak upravit blog na Blogger.com, stačí a další tipy např. jak přidat do Blogger template třeba Social Bookmarks, jak integrovat Google Adsense přímo do šablony, jak přidat Language Translation vlaječky pro online překlad do různých jazyků, jak přidat do hlavičky Rotating Banner, či CSS Navigation Menu, přip. Read More funkcionalitu, o tom zase někdy příště.

17 comments :

Anonymní řekl(a)...

Dík za článek. Sice blogger nepoužívám, ale uložil jsem si to na del.icio.us, kdyby náhodou.

Anonymní řekl(a)...

Ahoj Caymane,

prosim te o radu (vlastne dve) pro nas - BFUcka.
1)Hlavicku layoutu jsem z blogu odstranila, ale nedari se mi stahlou sablonu importovat na tu puvodni. Znamena to, ze musim tuto sablonu nahrat do svych template?

2)A mohl bys prosim publikovat nejaky prispevek o tom, jak přidat do Blogger template třeba Social Bookmarks, jak integrovat Google Adsense přímo do šablony, jak přidat Language Translation vlaječky pro online překlad do různých jazyků, jak přidat do hlavičky Rotating Banner, či CSS Navigation Menu, přip. Read More funkcionalitu atd...cekam na to jako na smilovani bozi :o)

Dekuji. Mej se krasne. Ivana

Cayman řekl(a)...

Ahoj SkydivePrincess,

ad 1) Ty šablony jsou obecně dvojího druhu - staré Classic a nové XML (beta) šablony, tj. šablony, neboli templates, pro Beta-Blogger. Záleží, jakou chceš nahrát, ale měla by to být vždy ta, která odpovídá typu. Doporučuji již používat jen ten nový typ XML, nazývaný někdy jako Beta-Blogger šablony.

Dá se to nahrát jednoduše:

- Menu - Layout - Edit HTML + tlačítko Procházet... pro nalezení toho souboru .XML (nové šablony z webu) + pak Upload (pro nahrání)

- Obvykle je potřeba takový nový template ještě upravit dle popisu, který dodávají s tou šablonou, např. nastavit účty do Adsense, upravit CSS menu v hlavičce apod. (když ne, tak je vše OK)

(Než se ale přistoupí k tomuto kroku, tak doporučuji na stejné stránce nejprve udělat zálohu stávající šablony - stisknutím "Download Full Template", tj. uložit stávající formát na disk do souboru s nějakým názvem, takže se dá pak kdykoliv udělat obnova. Ta volba "Download..." je nad tím výběrem jiné šablony.)

ad 2) Další tipy budu co nejdříve publikovat. Mám toho hodně v Draftu, tak až bude chvilka.

(Napíšu ti ještě večer mailem odpověď na Tvé extra dotazy.)

Kdyby něco, tak se ptej, ale moc toho už nevím :-)

Anonymní řekl(a)...

Dekuji, hned to jdu zkusit! Rovnez dekuji za email a tve nazory.

P.S.: Krasnou dovolenou bez prazskeho smogu! xx

iGurman řekl(a)...

Ďakujem za tip.

George řekl(a)...

Ahoj, na ten Navbar zlí lidé klikají na označit blog příznakem o čemž google informuje. Napoprvé se mi jej nepodařilo odstranit .body. jsem správně nenašel. Nastavil jsem zatím blog jako pro dospělé. Budu rád jestli někdy uvedeš nový postup. Jedná se o stránku AmicusWebSite http://amicuswebsite.blogspot.com

P.S.Jsem spíše publicista, ale rychle se učím!

Anonymní řekl(a)...

2skal: Ten postup stále platí, stačí jen v záložce "Layout" zvolit "Edit HTML" a pak dole v tom "Edit Template" dát Ctrl-F a najít ten <body> tag. Hned pod to pak doplnit ty řádky kódu popsaného výše.

Nemám teď na cestě bohužel rychlé připojení, tak se nemůžu podívat přímo na šablonu vašich stránek, ale snad se vám to podaří.

George řekl(a)...

Mnohokrát děkuji za trpělivost. Navbar je pryč. Udělal jsem to přesně podle návodu výše s prohlížečem Firefox. Teď se pokusím (zálohuji) na SkalWebSite, NiniveWebSite a dalších (celkem 6)

Díky, váš přítel

Anonymní řekl(a)...

Ahoj, v současné době se mi zobrazují články v v kompletním obsahu, nevíš jak by se dalo udělat, aby se mi na stránce zobrazoval např. prvních 200 znaků a pak by se človek musel proklinout na celý text? Lze to na blogspotu udělat? tomas

Anonymní řekl(a)...

2tomas: Jde to udělat i na Blogger.com a asi o tom napíšu, jak jsem to udělal tady. Když si dáš hlavní stránku, tak z každého příspěvku zobrazuji jen zhruba půlku a pak link "Celý příspěvek...", což by šlo stejně využít i pro větší zkrácení např. na jeden odstavec, 200 znaků apod.

Jestli na to spěcháš, tak pohledej na Webu frázi Post Summary in Blogger Layout nebo něco podobného.

Anonymní řekl(a)...

Ahoj!
Předem děkuji za užitečný post.
Chci se tě zeptat... Je možné i navbar skrýt i u blogů, které běží na blogspot/blogger, ale nemají název této služby jako doménu 2. řádu? Respektive... je to možné odstranit i z blogu, který je na www.xy.xy? Nebo mohu pouze u těch, které jsou na xy.blogspot.com?
Vůbec jsem nenašel v podmínkách i FAQu o celé této záležitosti ani zmínku... díky moc, príma den, ahoj! :)
jan

Cayman řekl(a)...

2jan: Nevím, zda jsem dobře porozuměl, to www.xy.xy znamená, že máš blog z blogger.com definovaný s Custom Domain?

Tu horní navigační lištu (Navbar) je, samozřejmě, možno skrýt u všech blogů používajících Blogger.com technologii (viz bod 2. výše v tomto příspěvku).

Anonymní řekl(a)...

2cayman: Přesně tak. Běží na bloggeru, ale je pod vlastní doménou... Jde mi právě o to, abych tím neporušil nějakou podmínku ...
jako něco takového (from http://labnol.blogspot.com/2007/01/how-to-hide-blogger-navbar-in-new.html ) :
Written on 24/6/07 9:16 PM

"* Unless you publish your blog via FTP, the Navbar cannot be disabled."

This is from Blogger Help answers:
http://help.blogger.com/bin/answer.py?answer=42269

At least I will not remove the bar for my blog.

Abych náhodou nenašel svůj blog "disable" :)
Díky moc, měj se prima

Cayman řekl(a)...

Ty pravidla Google v jejich helpu jsou staršího data a spíše bych postupoval dle toho článku na labnol.blogspot.com, který také nemá NavBar a uvádí např.:

"The old blogger as well as beta blogger's policy page do not mention anything about removing the blogger navigation toolbar..."

Takže v klidu, stačí jen zálohovat pravidelně blog template a exportovat všechny příspěvky s komentáři do zálohy.

Radič řekl(a)...

Velmi užitečný článek, díky!

#PravdaNeexistuje řekl(a)...

Asi jediného svého druhu v češtině. Díky!

Holden Caulfield řekl(a)...

Díky za zajímavý článek. Doplním, že problémy s českými znaky v url adrese již není třeba řešit.

A přihřeju vlastní polívčičku: Blogger: Jak vytvořit a kde najít šablonu na blog.

Okomentovat