NÁVOD NA BLOG | Skrytí příspěvku, ikonky na sociální sítě, vyhledávací box

Protože jsem slíbila, že se budu věnovat více blog designu a podobným věcem, přicházím s novinkou, kterou se budu snažit zařazovat častěji. Mám zatím pracovní název "Rychlá BLOGGER poradna" :) Nic originálního to není, přiznávám, ale nechci se zaseknout na názvu, když ten je vedle návodů až druhořadý! A o co jde? Často se mi dotazy, které mi od vás chodí na e-mail, opakují. A tak jsem se rozhodla sobecky sama sobě ušetřit čas a práci a jednou pro vždy to napsat všem:)

Dnes si tedy v krátkosti povíme o třech návodech. (někdy budou dva, jindy zase jeden - trojky se nedržte:) A tady máte jejich přehled - v textové i grafické podobě:

Jak "zabalit" článek a mít na hlavní stránce jen náhled?

Jak vložit malé ikony, které čtenáře přesměrují na sociální sítě?

Jak mít hezčí vyhledávací boxík?


 ❤  ❤  ❤  ❤

1. Náhled článku

Někteří začátečníci bádají nad tím, jak to druzí udělali, že se jim na blogu nezobrazuje celý článek, ale jen část - chcete-li jakýsi náhled nebo ochutnávka. Tady pomůže jeden obrázek více než tisíc slov :) Tam, kde chcete článek "přetrhnout", klikněte na označenou ikonku. Tamtadadá - a je to :)

obrázek: weheartit.com
 ❤  ❤  ❤  ❤

2. Ikonky na sociální media - a nejlépe v jednom řádku!

Přišlo mi hodně otázek typu "Jak na ty malé ikonky, co má ta a ta bloggerka? Já to chci taky!" No, tak to máte mít :) První část úspěchu je zajistit si tyto ikony :) Buď si je vytvoříte vlastní, nebo stáhnete z internetu. Můžete googlit přes klíčové slovo "social media icons". Přináším pár tipů, které jsem vygooglila já.

Barevné a veselé z Beautyholics Anonymous

Jednoduché a minimalistické z Media Loot
Ikonky i s textem z Beautiful Dawn Designs

Jakmile je stáhnete, musíte je uložit na web. První možnost je vyhradit si na to jeden příspěvek na vašem blogu, který nikdy nezveřejníte, jen do něj budete ukládat takové a podobné obrázky, které budete používat na blog. (do názvu příspěvku si napište třeba: NEVYDÁVAT) Nebo si je můžete nahrát na jakýkoliv server, který umožňuje uploadování obrázků. Za sebe doporučuji
Postimage.org.

Jakmile máte fotografii nahrané na serveru, musíte zjistit jejich adresu - správnou adresu poznáte tak, že je v podobném formátu jako např. http://www.stranka.cz/ikonka.png. Vždy tam musí být nějaká koncovka! (obvykle png)

Tohle představuje jednu z možností, jak zjistit adresu obrázku v editoru na blogu

 Takhle zjistíte adresu obrázku, když ikonu nahrajete na server Postimage.org.

Jakmile budete mít ikony uploadnuté, jejich adresy pak už stačí jen vložit do HTML/JavaScript gadgetu. Ten naleznete v možnosti Rozvržení - Vložit Gadget.



Do prázdného pole s názvem "Obsah" vložte toto:


Řádek zkopírujte tolikrát, kolik máte ikonek. Pokud použijete odkazy na Twitter, Facebook a Instagram, zkopírujete to třikrát a vyplníte příslušnými adresami :)

Vysvětlení:
adresa odkazu = například adresa vaší FB stránky
adresa obrázku = netřeba vysvětlovat :) viz předchozí řádky

Dodatek:
Pokud chcete v každém řádku jednu ikonku (např. je v ní nápis) za < /a> použijte <br /> 

A pak stačí už jen uložit a je to:)

 ❤  ❤  ❤  ❤

3. Minimalistický vyhledávací box

Vycházela jsem z tohoto tutorialu, který jsem lehce poupravila. Takže máte-li chuť si vyhledávání ještě více přizpůsobit, koukněte se tam :)

Pro tento vzhled:
 vložte do HTML/Java gadgetu (viz předchozí návod) tento kód:


Pro tento vzhled:
 vložte do HTML/JavaScript gadgetu tento kód:
 
Malé přizpůsobení:
délku boxu změníte u položky "size". Teď je tam "20"
text změníte u možnosti "value". Teď je tam "Search..."

Dodatek pro ty, kteří nechápou, kam to dát:

Rozvržení - přidat gadget - z možnosti zvolit HTML/JavaScript. (v předchozím návodu je to i graficky znázorněno) Do nadpisu můžete napsat např. "Vyhledejte na blogu" či jen nechat prázdný. Do obsahu vložíte kód z boxu :)

A taky tu proběhl dotaz, co se má připadně smazat. Pokud už jedno vyhledávací pole máte, smažte ho. Pokud jste neměli jeho nadpis, bude na blogu pod možností Prohledat tento blog. Klikněte na Upravit a na konci tabulky máte možnost Odstranit.


Ať se vydaří, přátelé! :)
A kdybyste měli nějaký problém, moc ráda vám pomohu - ať v komentářích, či přes e-mail.

Návod může být zastaralý. Na jeho aktualizaci se pracuje.
Prosím o trpělivost. Děkuji moc. Silvi

73 komentářů

  1. Si zlatá za tyto články, moc mi pomáhají ;)

    OdpovědětVymazat
  2. A ja som vždy rozmýšľala, ako skryť zvyšok článku :) Vďaka za skvelé návody! :)

    OdpovědětVymazat
  3. ♥ přesně tyhle 3 věci jsem chtěla změnit, děkuji, jsi zlatá. Jen dotaz - píšu příspěvky jako text, ne v HTML, takže aby se mi jednotně změnily všechny příspěvky, to asi nejde, že? Musím postupně každý změnit ručně, třeba písmo a styl

    OdpovědětVymazat
    Odpovědi
    1. Jestli myslíš návod se skrytím části textu, tak to se musí opravdu ručně :)

      Vymazat
    2. Nebo to lze nastavit pomocí HTML, ale bohužel se musí nastavit přesný rozměr obrázku, který se bude zobrazovat jako ten úvodní.

      Vymazat
  4. Jsi naprosto úžasná!! :) o tvém blogu jsem četla už před nějakou dobou, tak jsem ho tu měla otevřený, že se někdy vrhnu na úpravu blogu. Strašně jsem se toho bála, ale dneska jsem se do toho pustila, a s tvými návody to jde krásně!! hlavně jsem dostala i větší odvahu další věci hledat na internetu, nebát se těch kódů, a jsem teď sama na sebe hrdá! :) tyhle ikonky jsem strašně chtěla, tak jsi mi zrovna odpověděla na moje přání!! díky moc!! :) budu tě dál sledovat a těším se na další vychytávky!! :)
    Georgie :)

    OdpovědětVymazat
  5. Jéé, zrovna začátkem týdne jsem si vložila na blog "vyhledávání"
    ... nu a teď ho mám místo s "hledej" s parádní lupou:-)

    Děkuji převelice! ;-)
    Tak, a já jdu zpět obdivovat tu lupu :D

    OdpovědětVymazat
  6. Moc pěkné rady. x) Mě by se ještě líbil článek o tom, jak udělat to, abych měla komentáře pod články očíslované. Všude jsem to hledala a zatím jsem nenašla.

    OdpovědětVymazat
    Odpovědi
    1. To bych chtěla taky vědět... :)

      Vymazat
    2. Píšu si do deníčku a zkusím na to přijít :)

      Vymazat
    3. presne! inak skvelý článok SILVI:)

      Vymazat
    4. baby stačí, ak do css vložíte tento kod

      .comment-thread ol{
      counter-reset: contarcomentarios;
      }
      .comment-thread ol ol {
      counter-reset: contarbis;
      }
      .comment-header::before {
      content: counter(contarcomentarios,decimal)".";
      counter-increment: contarcomentarios;
      float: left;
      padding-right: 4px;
      }

      Vymazat
  7. Tak mně to nefunguje - políčko hledání, asi nevím, kam to správně vložit. A jestli mám něco jiného vymazat?
    Mohla by jsi Silvi upřesnit, kam přesně mám jít a tam vložit ten kód, pro ty nechápavé trubky jako jsem já, Děkuji moc :)

    OdpovědětVymazat
    Odpovědi
    1. Upřesněno v článku. :-)

      Vymazat
    2. Už to mám :)! Děkuju za upřesnění :). A ještě jedno velké díky za tyhle články. Chodím sem pravidelně a pomocí nich postupně vylepšuji svůj začínající blog :).

      Vymazat
  8. Mužete mi prosím někdo poradit, jak mám na blogu to hlavní pozadí mě nejde nastavit jako bílé, i když tam dám třeba průhledné. Nevíte někdo jak na to? :)

    OdpovědětVymazat
  9. moc si mi tímhle pomohla díky moc! :))

    OdpovědětVymazat
  10. Seš uplně nejvíc šikovná tyjo!:)

    OdpovědětVymazat
  11. jeeee, dakujem - hlavne za tip cislo jedna ;)
    doteraz som to mala prepnute na HTML a nechapala som, preco tam nemam tolko ikoniek ako potrebujem...vdaka tebe ma osvietilo ;)

    OdpovědětVymazat
  12. Díky za super návod :) jednička i dvojka využita beze zbytku :)!! Moc děkuji!

    OdpovědětVymazat
  13. Děkuju ti moc! Myslím si, že máš ten nejlepší blog ze všech, které znám. Vždycky mi nějakým způsobem pomůžeš :)

    OdpovědětVymazat
  14. Super návody, presne tie mini ikonky som potrebovala! Ďakujem, si skvelá :)

    OdpovědětVymazat
  15. Ahoj, vložila som si na blog podla tvojho návodu políčko "Search" aj sa mi tam pekne zobrazilo ale akosi hľadanie nefunguje :( a stále mi vypíše toto, nech hľadám čokoľvek: Ľutujeme, stránka, ktorú ste hľadali v tomto blogu, neexistuje. Vedela by si mi prosím poradiť kde by mohol byť problém?

    OdpovědětVymazat
  16. Ahoj,
    bohužel netuším, kde je problém :-(
    Teď jsem to kontrolovala a když to vkládám přes Rozvržení - vložit gadget - HTML/JavaScript, tak mi fungují oba. Děláš to takhle? A používáš blogspot?

    OdpovědětVymazat
  17. Ďakujem za radu...prvú som stále hladala...vedela by si poradiť aj ako dostať ten text "viac infotmácii" do stredua ako ho premenovať napr. na text celý článok alebo tak nejak?

    OdpovědětVymazat
  18. Moc děkuji za pomoc, vše se mi hodilo:) chtěla jsem se zeptat, jak na Archiv článků? Problémem je, že jsem ho nechtěně smazala a nejde mi znovu přidat... nevíš, jak na to? Díky moc! A.

    OdpovědětVymazat
  19. ahoj, Silvi, využila jsem ikonky a je to tak jednoduché, když to někdo srozumitelně vysvětlí. díky! :)

    chtěla bych se zeptat, zda neplánuješ třeba návod na to, jak vytvořit nějaké slušné záhlaví nebo jen ikonku (třeba Tvé Sd vlevo nahoře v záhlaví)? ráda bych blog trochu překopala.. :)

    OdpovědětVymazat
  20. tento návod mi strašne pomohol :D skvelé :D ďakujem

    OdpovědětVymazat
  21. Super návod, veľmi si mi pomohla! :)

    OdpovědětVymazat
  22. Může se zeptat, nevíš, kde bych našla nějakou pěknou ikonku na ask? Hrozně se mi líbí ty, na které si dávala odkazy, ale ask tam bohužel nikde není...

    OdpovědětVymazat
  23. Ahoj, skvělý článek:) můžu se jen zeptat ohledně skrytí části článku, kde se dá změnit ten popisek k odkrytí schovaného textu? opravdu tam nechci mít "zobrazit více>>" ale nevím kde to změnit, můžeš mi s tím prosím poradit? děkuji:)

    OdpovědětVymazat
  24. Ahoj Silvi,
    chtěla byhc se jen zeptat, také ohledně skrytí části článku, kde se dá změnit ten popisek k odkrytí schovaného textu? Byla by si moc hodná, děkuju! :)

    OdpovědětVymazat
    Odpovědi
    1. Rozvržení - U Příspěvky na blogu kliknout vpravo dole na "Upravit" a u možnosti "Hlavní stránka – možnosti" druhý řádek: Text odkazu na stránku příspěvku ... tam to můžeš změnit :-)

      Vymazat
  25. Bezvadný nápad Blogger poradna, díky, zkusím se tím prokousat:-))
    Ajka

    OdpovědětVymazat
  26. Potřebuju poradit:) Na mém blogu se mi přes gadget překrývá příspěvek a opačně, konkrétně jen fotky, jde nějak v kódu HTML upravit ta šířka, nebo musím měnit šablonu? Děkuju. :)

    OdpovědětVymazat
    Odpovědi
    1. Betko, bohužel přesně nevím, co myslíš. Zkus mi to, prosím, popsat do e-mailu. (nejlépe i odkaz na blog) Děkuji! :)

      Vymazat
  27. Ahoj ešte by som sa chcela spýtať či nevieš ako sa robí to ak chcem aby pri prejdení myškou na tie ikonky sa zmenili....napr. farbu alebo tak.Ďakujem

    OdpovědětVymazat
  28. Ahoj, prosím tě, jak se zbavím názvu blogu v záhlaví? Mám tam vlastní pozadí, ale pořád se mi do toho plete automatický název, který tam fakt nechci... www.nikolascestuje.cz

    OdpovědětVymazat
  29. Díky moc za pomoc. Jsi skvělá :-)!!!

    OdpovědětVymazat
  30. ahoj silvi diky moc za prispevok o skrateni textu :) velmi pomohlo..avšak čo sa chcem opýtať, ako si zmenila z povodnej verzie na "precist cely clanok" ? mne ta ukazuje "viac informacii" vobec sa mi to nepaci :) dakujem za radu

    OdpovědětVymazat
  31. Tento komentář byl odstraněn autorem.

    OdpovědětVymazat
  32. Mohla bys mi prosím poradit, jak udělám abych měla celý blog v aj, myslím jako třeba to domovská sttránka co je dole a tak:)

    OdpovědětVymazat
  33. Díky, moc mi to pomohlo, ale mohla bys mi poradit, jak se do té ikonky vloží email? To mi nejde :/

    OdpovědětVymazat
  34. Absolutně nejlepší návody, co jsem našla!! A že je hledám nějakou tu dobu! :-D

    OdpovědětVymazat
  35. To som potrebovala pre svoj blog, ďakujem pekne! ;)

    OdpovědětVymazat
  36. super návod, dík za tutorial! ten nápad s nepublikovaným příspěvkem s obrázky je dokonalý a jednoduchý!
    mám to přesně tak, jak jsem chtěla ;-)
    Lenka
    http://zahradananiti.blogspot.cz/

    OdpovědětVymazat
  37. Uplně super návody máš, celý blog se mi moc líbí, jen by jsem se chtěla zeptat k těm ikokám jsem totiž tele, mám všechno už hotový daný do článku ty ikonky, a potom si otevřu rozvržení, HTML a pak už to moc nechápu, klinu na tu ikonku okopíruju ten odkaz a co dál? to jsem asi nějako nepochopila:// Děkuju, za rady, a ještě kdyby jsi mi s tímhle poradila byla by jsi úžasná:))
    http://photobyanni.blogspot.cz/

    OdpovědětVymazat
  38. Ahoj, návod na ikonky je super , robila som to presne podla návodu, ale z nejakého neurčitého dôvodu mám tie ikonky obrovské a nvm kde v html kóde sa dajú zmenšiť. Budem rada ak mi poradíš.

    OdpovědětVymazat
  39. Si skvelá! veľmi mi to pomohlo!
    Chcela som sa spýtať, či nevieš náhodou ako by som mohla to "zobraziť viac" posunúť viac na stred , pretože teraz to mám na pravo a moc sa mi to nepáči. Ďakujem :)

    OdpovědětVymazat
  40. Zachránila jsi mi život! Děkuji ;)

    OdpovědětVymazat
  41. Tento komentář byl odstraněn autorem.

    OdpovědětVymazat
  42. Absolútne úžasný článok! Veľmi ti ďakujem :) Strašne si mi pomohla :)

    OdpovědětVymazat
  43. Tento komentář byl odstraněn autorem.

    OdpovědětVymazat
  44. Mnohokrát děkuji opravdu mi článek pomohl....Díky

    OdpovědětVymazat
  45. Přesně toto jsem hledala, jak vylepšit svůj blog :) Děkuju moc! :)

    OdpovědětVymazat
  46. Super článek, ale prosím :) ikony jsem nahrála, přesměrování funguje, ale ty ikony mám hrozně veliké, jak se zmenší??

    OdpovědětVymazat
  47. Silvi u teba na stránke, nájdem vždy pomoc :)

    OdpovědětVymazat
  48. Ahoj, článek je super, jen mám otázku. Když nahraji ikonku na Postimage.org a kliknu do "kopírovat do schránky" zobrazí se mi "Copied" nevím si s tím rady. :)
    Děkuji za odpověď! :)

    OdpovědětVymazat
  49. Ahoj, já mám problém právě naopak, článek se mi "zabalí", aniž bych to chtěla... spíš bych chtěla články celé na hlavní stránce, nevíš, jak to udělat? :)

    OdpovědětVymazat
    Odpovědi
    1. Ahoj, zkus to úplně stejně jak to vysvětluje v tomto článku akorát to dáš až nakonec :)

      Vymazat
  50. Úžasný článok :)
    veľmi ďakujem - pomohol mi! :)

    OdpovědětVymazat
    Odpovědi
    1. To já jsem se zasekla na tom bodu odkazů.. vůbec mi to nejde!!!

      Vymazat
  51. Ahoj,
    možná, že to sem nepatří, ale už nevím na koho se obrátit. Nesetkala jsi se s tím, že když kopíruješ odkaz ze svého blogu, tak se při vložení odkazu na fb, messenger, viber atd. zobrazí jako obrázek záhlaví blogu? Nevěděla bys co s tím?
    Předem děkuji za odpověď

    OdpovědětVymazat
  52. děkuji, tvůj návod mi hodně pomohl :))

    OdpovědětVymazat
  53. Zase úžasný, děkuji, vše se povedlo :) jen rada na ty malý ikonky, já to vyřešila tak, že jsem si prostě stáhla z internetu menší a bylo!

    OdpovědětVymazat
  54. Další slvělý článek a návod,který pomohl! Děkuju! <3

    OdpovědětVymazat
  55. Děkuju moc. Ty ikony jsem potřebovala...

    OdpovědětVymazat

Děkuju za vaše komentáře. Děláte mi velkou radost! ♥