Jak přidat ikony soc. sítí (FB a Instagram) do horní části na webu ve Webnode?

Hledáte způsob jak na webové stránky u Webnode vložíte ikonky soc. sítí do horní části webu?

V návodech Jak propojit Facebook s webem? a Jak propojit www stránky se sociální sítí Instagram? jsme si ukázali jak Váš web můžete různými způsoby propojit se soc. sítěmi Facebook a Instagram.

V tomto návodu si ukážeme další velmi jednoduché řešení pro soc.siete FB / Instagram a to přidání ikonek soc. sítí do horní části Vašeho webu (vlevo/nahoru).

Viz. online ukázka (demo)

#1. První krok je úprava URL adres pro Vaše sociální sítě v kódu nižšie.

Na řádku č. 23 v kódu upravte hodnotu URL-ADRESA-PRE-INSTAGRAM pro Instagram.

Přepište hodnotu URL-ADRESA-PRE-INSTAGRAM na URL adresu Vašeho Instagramu. (Např. URL adresa pro můj Instagram je: https://www.instagram.com/iamwilliam5/ )

Na řádku č. 28 v kóde upravte hodnotu URL-ADRESA-PRE-FACEBOOK pro Facebook.

Přepište hodnotu URL-ADRESA-PRE-INSTAGRAM na URL adresu Vašeho Facebooku. (Např. URL adresa pre moju firmu na Facebook je: https://www.facebook.com/webgrowcz/ )

#2. Druhý krok je vložení upraveného kódu do hlavičky stránek.

V horní liště editoru klikněte na a zvolte např. “Úvodní stránku” a pokračujte možností “SEO Nastavení stránky” a upravený kód vložte do sekce “HTML kód v hlavičce“.

Kód vložte do hlavičky na všechny stránky na kterých to chcete mít 🙂

Potřebný kód je:

<style>
            .wpromotionicons {
                position: absolute;
                top: 10px;
                left: 5px;
                z-index: 99;
            }
            .wpromotionicons ul {
                margin: 0;
                padding-left: 0;
            }
            .wpromotionicons ul li {
                margin-left: 5px;
                list-style-type: none;
                display: inline-block;
            }
            @media screen and (max-width: 767px) {.wpromotionicons {left: 165px;}}
        </style>
    
        <div class="wpromotionicons">
            <ul>
                <li>
                    <a href="URL-ADRESA-PRE-INSTAGRAM" target="_blank" rel="noopener noreferrer">
                        <img src="https://www.wpromotions.eu/wp-content/uploads/2019/01/instagram-wpromotions.png" alt=Instagram">
                    </a>
                </li>
                <li>
                    <a href="URL-ADRESA-PRE-FACEBOOK" target="_blank" rel="noopener noreferrer">
                        <img src="https://www.wpromotions.eu/wp-content/uploads/2019/01/facebook-wpromotions.png" alt="Facebook">
                    </a>
                </li>
            </ul>
        </div>

<style>

.wpromotionicons {

position: absolute;

top: 10px;

left: 5px;

z-index: 99;

}

.wpromotionicons ul {

margin: 0;

padding-left: 0;

}

.wpromotionicons ul li {

margin-left: 5px;

list-style-type: none;

display: inline-block;

}

@media screen and (max-width: 767px) {.wpromotionicons {left: 165px;}}

</style>

<ul>

<li>

</a>

</li>

<li>

</a>

</li>

</ul>

</div>

TIP: Vložte si na web online chat pro rychlejší komunikaci s návštěvníky Vašeho webu. Doporučuji službu, která je zdarma – Smartsupp

Další návody

Jak přejmenovat “Košík” v menu ve Webnode e-shopu?

od Viliam | Čvn 18, 2020 | Všechny návody, Webnode E-shop

Chtěli byste přejmenovat košík v e-shopu ve Webnode z "Košík" na např. "Můj košík"? S mým jednoduchým návodem to určitě zvládnete. Stačí se přihlásit do mého newsletteru - William promotions news - a získat předpřipravený kód. V kódu jednoduše změníte text na...

Jak na web ve Webnode přidat animaci písajíci tužky?

od Viliam | Čvn 14, 2020 | Všechny návody, Zdroje zdarma

Chcete zaujmout Vaše publikum? Chtěli byste si vylepšit Váš web? Vytvořil jsem pro Vás kód, který umožní na Vašem webu nebo e-shopu ve Webnode zobrazit animaci písajúcej tužky. V kódu si můžete zvolit vlastní text, aby tužka psala přesně to, co chcete! :)...

Jak přidat FAQ záložky na web ve Webnode?

od Viliam | Čvn 9, 2020 | Všechny návody, Základné, Zdroje zdarma

Chtěli byste si na webové stránky ve Webnode přidat FAQ ?V návodu Jak zobrazit a skrýt text po kliknutí na tlačítko "Více textu"? jsem Vám ukázal jednoduchý způsob jak na webu skrýt text. V tomto návodu si ukážeme, jak je možné pomocí mého kódu vytvořit na webu...

Jak vytvořit jednoduchý vizitkový web?

od Viliam | Kvě 31, 2020 | Všechny návody, Základné, Zdroje zdarma

Jak vytvořit jednoduchý vizitkový web? (scroll-ovací web)Co je to vizitkový web? Vizitkový web je jednoduchý web, který stručně a jasně představuje Vaše služby, či produkty. Je to jednoduchá webová stránka, která slouží pro získání základních informací o Vaší firmě....

Jak si vytvořit vlastní patičku ve Webnode?

od Viliam | Kvě 30, 2020 | Scripty, Všechny návody, Zdroje zdarma

Chtěli byste na web / e-shop přidat vlastní patičku (footer) ve Webnode?Chtěli byste si na webové stránky, či e-shop ve Webnode přidat přesměrování resp. odkaz na Vaše obchodní podmínky & GDPR do patičky? S mým jednoduchým návodem to určitě zvládnete. Stačí se...

Jak skrýt kategorii “všechny produkty” ve výpisu produktů v e-shopu od Webnode?

od Viliam | Kvě 27, 2020 | Scripty, Všechny návody, Webnode E-shop

Jak na webu ve Webnode skrýt kategorii "Všechny produkty" ve výpisu produtků? V návodu Jak ve Webnode skrýt košík v eshopu? a Jak ve Webnode skrýt datum zveřejnění článku? jsme si ukázali jak jednoduše je možné ve Webnode něco "skrýt". V tomto článku se dozvíte, jak...

Jak ve Webnode skrýt datum zveřejnění článku?

od Viliam | Bře 11, 2020 | Scripty, Všechny návody, Zdroje zdarma

Jak na webe ve Webnode skryť datum zveřejnění článku??V návodu Jak ve Webnode skrýt košík v eshopu? jsme si ukázali jak jednoduše je možné ve Webnode něco "skrýt". V tomto návodu se dozvíte, jak jednoduše můžete ve Webnode, odstranit datum z článku ve Vašem blogu....

Jak na webové stránky vložit mapu z Mapy.cz?

od Viliam | Úno 11, 2020 | Všechny návody, Základné

Jak na Vaše webové stránky vložit mapu od Mapy.cz?V návodech Jak správně nastavit Google Mapu ve Webnode? a Jak si vytvořit mapu s vlastními body (špendlíky na mapě)? jsme si ukázali jednoduché řešení pro přidání mapy na web přes služby od Google. V tomto návodu se...

Jak na web pridať padajíci konfety?

od Viliam | Pro 31, 2019 | Scripty, Všechny návody, Widgety

Jak na webové stránky vo Webnode pridať animáciu - padajíci konfety?Do mé Webnode poradny přišla otázka, zda je možné na webu ve Webnode přidat animaci padajících konfet. Ano je to možné - pro všechny, kteří hledají "padající konfety na web" jsem připravil kód, který...

« Starší příspěvky

Líbil se ti tento návod? Pošli ho přátelům 🙂

Vytvořit web zdarma

About
Latest Posts

Follow me

Viliam

CEO at Webgrow s.r.o.

Baví mě Internet a zvlášť redakční systémy jako Webnode nebo WordPress s Divi šablónou. Vytvořil jsem pro Vás portál Wpromotions.eu, abych Vám pomohl s tvorbou Vaší webové stránky nebo e-shopu. V případě potřeby mě neváhejte kontaktovat, rád Vám poradím.

Follow me

Trackbacky/pingbacky

Jak propojit Facebook s webem?| elegantně a jednoduše | Wiliam Promotions - […] návode Jak přidat ikony soc. sítí (FB a Instagram) do horní části na webu ve Webnode? jsem vám ukázal velmi…
Jak propojit www stránky se sociální sítí Instagram? | Wiliam Promotions - […] TIP: Přidejte si do pravého horního rohu ikony sociálních sítí FB a Instagram. Více v návodu Jak přidat ikony…
Script pro CZ / SK svátek a aktualní den | Wiliam Promotions - […] TIP: Přidejte si do pravého horního rohu ikony sociálních sítí FB a Instagram. Více v návodu Jak přidat ikony…
Jak si stáhnout fakturu ve Webnode? | Wiliam Promotions - […] TIP: Přidejte si do pravého horního rohu ikony sociálních sítí FB a Instagram. Více v návodu Jak přidat ikony…
Jak Vytvořit Web nebo E-shop | Jednoduše a Zdarma | Wiliam Promotions - […] Jak přidat ikony soc. sítí (FB a Instagram) do horní části na webu ve Webnode? […]
Jak zobrazit a skrýt text po kliknutí na tlačítko "Více textu"? | Wiliam Promotions - […] Jak přidat ikony soc. sítí (FB a Instagram) do horní části na webu ve Webnode? […]
Jak vytvořit jednoduchý vizitkový web? | Wiliam Promotions - […] Jak přidat ikony soc. sítí (FB a Instagram) do horní části na webu ve Webnode? […]

Zanechat komentář Zrušit odpověď na komentář

Tato stránka používá Akismet k omezení spamu. Podívejte se, jak vaše data z komentářů zpracováváme..

Jak přidat ikony soc. sítí (FB a Instagram) do horní části na webu ve Webnode?

Hledáte způsob jak na webové stránky u Webnode vložíte ikonky soc. sítí do horní části webu?

#1. První krok je úprava URL adres pro Vaše sociální sítě v kódu nižšie.

Na řádku č. 23 v kódu upravte hodnotu URL-ADRESA-PRE-INSTAGRAM pro Instagram.

#2. Druhý krok je vložení upraveného kódu do hlavičky stránek.

Potřebný kód je:

Další návody

Jak přejmenovat “Košík” v menu ve Webnode e-shopu?

Jak na web ve Webnode přidat animaci písajíci tužky?

Jak přidat FAQ záložky na web ve Webnode?

Jak vytvořit jednoduchý vizitkový web?

Jak si vytvořit vlastní patičku ve Webnode?

Jak skrýt kategorii “všechny produkty” ve výpisu produktů v e-shopu od Webnode?

Jak ve Webnode skrýt datum zveřejnění článku?

Jak na webové stránky vložit mapu z Mapy.cz?

Jak na web pridať padajíci konfety?

Trackbacky/pingbacky

Zanechat komentář Zrušit odpověď na komentář

Doporučeno: Vytvořte si web zdarma

Rubriky

Nejnovější články

Vytvořte si web nebo e-shop

Kupte mi kávu ☕