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 ">
                        <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 ">
                        <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 na web ve Webnode vložit anketu?

od Viliam | Srp 16, 2019 | Všechny návody, Widgety

Chcete na webové stránky ve Webnode vložit anketu?Online dotazník zdarma (anketa na web) je jeden z nejčastějších způsobů jak dostat od návštěvníků webu zpětnou vazbu. Bez zpětné vazby je obtížné posoudit, zda na své zákazníky působíte správné a zda má vůbec Vaše...

Jak přidat obrázek GIF ve Webnode?

od Viliam | Srp 16, 2019 | Všechny návody, Základné

Chcete na web ve Webnode vložit GIF obrázek? Systém Webnode nepovoluje gify, když je vložíte jako obrázek. Z tohoto důvodu musíte nejprve požadovaný .GIF obrázek nahrát na externí stránku a získat tak URL adresu obrázku. Získanou URL adresu vložíte do kódu a HTML kód...

Online rezervační systém na web? Recenze systému, který se přizpůsobí každému podnikání

od Viliam | Čvc 7, 2019 | Všechny návody, Widgety, Zdroje zdarma

Chcete na Váš web přidat spolehlivý a jednoduchý online rezervační systém? Reservanto je nejlepší rezervační systém, který nabízí verzi Zdarma bezplatně a to dožitovne. Jedním z cílů Vašeho webu může být například vytvoření rezervace. Nejčastěji tuto formu využívají...

Jak propojit Facebook Messenger s webem u Webnode?

od Viliam | Kvě 23, 2019 | Všechny návody, Widgety, Zdroje zdarma

Chcete propojit Facebook Messenger s webem u Webnodea získat tak "online chat" na webu zcela zdarma? Jednoduchý návod na propojení webu u Webnode s Facebook Messenger Facebook Messenger je skvělou volbou pro komunikaci s návštěvníkem Vašeho webu. Po kliknutí na...

Jak si vytvořit web stránku jednoduše a zdarma (Webnode návod)

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

Chtěli jste si někdy vytvořit vlastní webovou stránku úplně od začátku? Chcete si vytvořit web nebo e-shop a zviditelnit se na Internetu? Začněte právě teď a naučte se jak si jednoduše vytvoříte svůj první vlastní web. Vytvoření webu s Webnode je...

Jak Nastavit Emailový Marketing ve Webnode přes MailChimp?

od Viliam | Kvě 3, 2019 | Všechny návody

Hledáte jednoduché řešení pro e-mailový marketing ve Webnode? Chcete na Váš web vložit vyskakovací okno (pop-up) pro sběr e-mailů? Posílejte svým odběratelům novinky skrz automatizovaný systém MailChimp. Je to zdarma do 2 000 odběratelů a 12 000 e-mailů...

Jak na web přidat remarketing kód ve Webnode?

od Viliam | Bře 25, 2019 | PPC, Všechny návody

Jak nastavit remarketing ve Webnode? a Kam vložit remarketing kód? V návode Jak přidat konverzní kód ve Webnode? jsem Vám ukázal jednoduchý postup pro vložení konverzního kódu pro sledování konverzí. Pojďme se nyní společně podívat na další PPC metodu tzv....

Jak nastavit poštovního klienta Gmail s emailem od Webnode?

od Viliam | Úno 13, 2019 | Emaily, Všechny návody

Chcete propojit svůj e-mail u Webnode s Gmail.com a nastavit Gmail jako poštovního klienta? Příjem zpráv z Webnode do Gmail. V návode Jak Vytvořit Profesionální E-mailový Podpis? Jednoduše a ZDARMA jsem Vám ukázal velmi jednoduchý způsob jak si vytvořit...

Jak sledovat aktivitu návštěvníků Vašeho webu pomocí SmartLook?

od Viliam | Úno 9, 2019 | Všechny návody, Widgety

Chcete-li pochopit chování Vašeho klienta (návštevníka) na webu? Služba SmartLook Vám s tým určite pomôže. Čo je to "Smartlook" ? Smartlook je online aplikace pro nahrávání pohybu myši návštěvníky Vašeho webu / eshopu, Pomůže Vám odhalit chyby na Vašem...

« Starší příspěvky

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

Vytvořit web zdarma

About
Latest Posts

Viliam

Jednatel 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.

Latest posts by Viliam (see all)

Jak na web ve Webnode vložit anketu? - 16.8.2019
Jak přidat obrázek GIF ve Webnode? - 16.8.2019
Online rezervační systém na web? Recenze systému, který se přizpůsobí každému podnikání - 7.7.2019

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? […]

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.