{"id":9169,"date":"2024-05-13T07:00:26","date_gmt":"2024-05-13T07:00:26","guid":{"rendered":"https:\/\/musilda.cz\/?p=9169"},"modified":"2024-05-13T07:00:26","modified_gmt":"2024-05-13T07:00:26","slug":"jak-ve-wordpressu-vytvorit-landing-page","status":"publish","type":"post","link":"https:\/\/affinite.io\/cs\/jak-ve-wordpressu-vytvorit-landing-page\/","title":{"rendered":"Jak ve WordPressu vytvo\u0159it landing page?"},"content":{"rendered":"\n

Landing page je str\u00e1nka, kter\u00e1 slou\u017e\u00ed k jednomu konkr\u00e9tn\u00edmu \u00fa\u010delu. Nej\u010dast\u011bji se jedn\u00e1 o str\u00e1nku, kter\u00e1 reprezentuje samostatn\u00fd produkt, nebo slu\u017ebu. Landing page tak\u00e9 b\u00fdv\u00e1 \u010dasto myln\u011b ozna\u010dovan\u00e1 jako domovsk\u00e1, co\u017e nen\u00ed pravda.<\/p>\n\n\n\n

Jak\u00fd je rozd\u00edl mezi landing page a home page?<\/h2>\n\n\n\n
\"\"<\/a><\/figure>\n\n\n\n

Landing page se d\u00e1 oproti home page jednodu\u0161e rozpoznat. Krom\u011b v\u00fd\u0161e zm\u00edn\u011bn\u00fdch bod\u016f existuje mnoho dal\u0161\u00edch ind\u00edci\u00ed, kter\u00e9 n\u00e1m napov\u00ed, o jakou str\u00e1nku se ve skute\u010dnosti jedn\u00e1.<\/p>\n\n\n\n

N\u00ed\u017ee si uk\u00e1\u017eeme jednotliv\u00e9 rozd\u00edly mezi landing page a home page na webu Shopify.<\/p>\n\n\n\n

Home page<\/h3>\n\n\n\n
\"\"<\/a><\/figure>\n\n\n\n

C\u00edl str\u00e1nky<\/h4>\n\n\n\n

Domovsk\u00e1 str\u00e1nka webu se zam\u011b\u0159uje na vytv\u00e1\u0159en\u00ed prost\u0159ed\u00ed, kter\u00e9 u\u017eivatele navede na jednotliv\u00e9 sekce webu. Krom\u011b toho zde najdeme spousta obsahu, nespo\u010det produkt\u016f, nab\u00edzen\u00fdch slu\u017eeb atd.).<\/p>\n\n\n\n

Naviga\u010dn\u00ed menu<\/h4>\n\n\n\n
\"\"<\/a><\/figure>\n\n\n\n

Home page obvykle obsahuje horn\u00ed naviga\u010dn\u00ed menu pro jednoduchou navigaci u\u017eivatel\u016f na webu.<\/p>\n\n\n\n

Zdroj provozu<\/h4>\n\n\n\n
\"\"<\/a><\/figure>\n\n\n\n

Domovsk\u00e1 str\u00e1nka si \u010dasto z\u00edsk\u00e1v\u00e1 nov\u00e9 n\u00e1v\u0161t\u011bvn\u00edky formou tzv. organick\u00e9 n\u00e1v\u0161t\u011bvnosti (n\u00e1v\u0161t\u011bvn\u00edci, kte\u0159\u00ed p\u0159i\u0161li na na\u0161i webovou str\u00e1nku p\u0159irozen\u011b prost\u0159ednictv\u00edm vyhled\u00e1va\u010d\u016f).<\/p>\n\n\n\n

Landing page<\/h3>\n\n\n\n
\"\"<\/a><\/figure>\n\n\n\n

C\u00edl str\u00e1nky<\/h4>\n\n\n\n

Na druh\u00e9 stran\u011b stoj\u00ed landing page, kter\u00e1 nepropaguje cel\u00fd web, ale pouze jednu ur\u010ditou sekci. M\u00e1 pouze jeden hlavn\u00ed c\u00edl, kter\u00fdm m\u016f\u017ee b\u00fdt nap\u0159\u00edklad z\u00edsk\u00e1v\u00e1n\u00ed email\u016f od n\u00e1v\u0161t\u011bvn\u00edk\u016f, prodej produktu\/slu\u017eby, nebo registrace.<\/p>\n\n\n\n

Naviga\u010dn\u00ed menu<\/h4>\n\n\n\n

U landing page je naopak v\u00fdhodn\u00e9 menu skr\u00fdt. Bez naviga\u010dn\u00edho menu se u\u017eivatel\u00e9 budou moci l\u00e9pe soust\u0159edit na c\u00edl dan\u00e9 landing page. U n\u011bkter\u00fdch web\u016f po skryt\u00ed naviga\u010dn\u00edho menu u landing page do\u0161lo ke zv\u00fd\u0161en\u00ed konverzi u\u017eivatel\u016f a\u017e o 40%.<\/p>\n\n\n\n

Zdroj provozu<\/h4>\n\n\n\n
\"\"<\/a><\/figure>\n\n\n\n

Zdroj n\u00e1v\u0161t\u011bvnosti landing page je obvykle z placen\u00e9 reklamy. Pomoc\u00ed reklamy samoz\u0159ejm\u011b m\u016f\u017eeme odkazovat u\u017eivatele tak\u00e9 na domovskou str\u00e1nku, ale tento postup se v\u011bt\u0161inou nedoporu\u010duje.<\/p>\n\n\n\n

Tvorba landing page ve WordPressu<\/h2>\n\n\n\n

Kdy\u017e u\u017e ch\u00e1peme z\u00e1kladn\u00ed rozd\u00edly mezi jednotliv\u00fdmi str\u00e1nkami, m\u016f\u017eeme se pustit do tvorby samotn\u00e9 landing page.<\/p>\n\n\n\n

Pro tvorbu landing page existuje hned n\u011bkolik zp\u016fsob\u016f. My se v\u0161ak zam\u011b\u0159\u00edme na tvorbu bez jak\u00e9hokoliv pluginu pomoc\u00ed nativn\u00edho Gutenberg editoru:<\/p>\n\n\n\n

1) zamy\u0161len\u00ed nad c\u00edlem landing page<\/h3>\n\n\n\n

P\u0159ed tvorbou se zamysl\u00edme nad samotn\u00fdm c\u00edlem landing page. Jako p\u0159\u00edklad si vytvo\u0159\u00edme str\u00e1nku, ve kter\u00e9 bude hlavn\u00edm c\u00edlem registrace u\u017eivatel\u016f na webu.<\/p>\n\n\n\n

2) Vytvo\u0159\u00edme novou str\u00e1nku<\/h3>\n\n\n\n

Str\u00e1nky > P\u0159ehled str\u00e1nek > Vytvo\u0159it novou str\u00e1nku<\/strong><\/p>\n\n\n\n

\"\"<\/a><\/figure>\n\n\n\n

3) Vzory<\/h3>\n\n\n\n

Po vytvo\u0159en\u00ed str\u00e1nky dostaneme mo\u017enost pou\u017e\u00edt ji\u017e vytvo\u0159en\u00fd layout webu, kter\u00fd n\u00e1sledn\u011b m\u016f\u017eeme upravit.<\/p>\n\n\n\n

\"\"<\/a><\/figure>\n\n\n\n

V dne\u0161n\u00edm \u010dl\u00e1nku vzory nebudeme pou\u017e\u00edvat a za\u010dneme s tvorbou od nuly.<\/p>\n\n\n\n

4) Z\u00e1klady Gutenbergu<\/h3>\n\n\n\n

Gutenberg je vestav\u011bn\u00fd WordPress editor, ve kter\u00e9m m\u00e1me k dispozici n\u011bkolik dostupn\u00fdch blok\u016f, pomoc\u00ed kter\u00fdch jsme schopni cel\u00fd web postavit.<\/p>\n\n\n\n

\"\"<\/a><\/figure>\n\n\n\n

Vysv\u011btlen\u00ed Gutenberg editoru:<\/strong><\/p>\n\n\n\n

    \n
  1. Nadpis str\u00e1nky<\/li>\n\n\n\n
  2. Pomoc\u00ed plusu p\u0159id\u00e1me na str\u00e1nku nov\u00e9 bloky<\/li>\n\n\n\n
  3. Pro uk\u00e1zku je na str\u00e1nce vlo\u017een blok pro paragraf a seznam<\/li>\n\n\n\n
  4. Po v\u00fdb\u011bru bloku se na prav\u00e9 stran\u011b otev\u0159e panel s n\u00e1stroji pro \u00fapravu<\/li>\n\n\n\n
  5. Po rozkliknut\u00ed se otev\u0159e panel, na kter\u00e9m uvid\u00edme v\u0161echny pou\u017eit\u00e9 bloky na dan\u00e9 str\u00e1nce (pozice blok\u016f lze p\u0159etahov\u00e1n\u00edm jednodu\u0161e m\u011bnit)<\/li>\n<\/ol>\n\n\n\n

    Stru\u010dn\u00e9 vysv\u011btlen\u00ed v\u0161ech Gutenberg blok\u016f najdete zde<\/strong><\/a>.<\/p>\n\n\n\n

    5) Tvorba landing page pomoc\u00ed Gutenberg blok\u016f<\/h3>\n\n\n\n
    \"\"<\/a><\/figure>\n\n\n\n

    Po p\u00e1r minut\u00e1ch je landing page p\u0159ipraven\u00e1 k pou\u017eit\u00ed. V\u0161echny pou\u017eit\u00e9 bloky najdete v lev\u00e9m panelu. Prvn\u00ed sekce je \u0159e\u0161en\u00e1 pomoc\u00ed dvou sloupc\u016f a druh\u00e1 pomoc\u00ed skupiny, u kter\u00e9 je nastavena barva pozad\u00ed na zelenou. <\/p>\n\n\n\n

    Pro odsazen\u00ed prvk\u016f se pou\u017eil blok „mezera“. Tla\u010d\u00edtko bude m\u00edt za \u00fakol odkazovat n\u00e1v\u0161t\u011bvn\u00edky na registra\u010dn\u00ed str\u00e1nku s formul\u00e1\u0159em.<\/p>\n\n\n\n

    Po dokon\u010den\u00ed ulo\u017e\u00edme \u00fapravy.<\/p>\n\n\n\n

    6) Odstran\u011bn\u00ed vrchn\u00edho menu<\/h3>\n\n\n\n

    Zmi\u0148oval jsem, \u017ee u landing page je vhodn\u00e9 naviga\u010dn\u00ed menu skr\u00fdt. To provedeme n\u00e1sledovn\u011b:<\/p>\n\n\n\n

    Skryt\u00ed naviga\u010dn\u00edho menu:<\/strong><\/p>\n\n\n\n

      \n
    1. V administraci WP otev\u0159eme Vzhled > Editor<\/strong> <\/li>\n\n\n\n
    2. Vybereme mo\u017enost „str\u00e1nky<\/strong>“ <\/li>\n<\/ol>\n\n\n\n
      \"\"<\/a><\/figure>\n\n\n\n
        \n
      1. Zvol\u00edme na\u0161i landing page<\/li>\n\n\n\n
      2. Klikneme na mo\u017enost \u00fapravy str\u00e1nky<\/li>\n<\/ol>\n\n\n\n
        \"\"<\/a><\/figure>\n\n\n\n
          \n
        1. Dvakr\u00e1t klikneme na naviga\u010dn\u00ed menu a zvol\u00edme „upravit \u0161ablonu“<\/li>\n<\/ol>\n\n\n\n
          \"\"<\/a><\/figure>\n\n\n\n
            \n
          1. V \u0161ablon\u011b str\u00e1nky klikneme na naviga\u010dn\u00ed menu(1), zobraz\u00edme mo\u017enosti(2) a na z\u00e1v\u011br menu sma\u017eeme(3). Po dokon\u010den\u00ed \u00faprav zm\u011bny op\u011bt ulo\u017e\u00edme.<\/li>\n<\/ol>\n\n\n\n
            \"\"<\/a><\/figure>\n\n\n\n

            7) Fin\u00e1ln\u00ed vzhled landing page<\/h3>\n\n\n\n

            V\u00fdsledkem je jednoduch\u00e1 landing page s c\u00edlem registrace nov\u00fdch u\u017eivatel\u016f.<\/p>\n\n\n\n

            \"\"<\/a><\/figure>\n","protected":false},"excerpt":{"rendered":"

            Landing page je str\u00e1nka, kter\u00e1 slou\u017e\u00ed k jednomu konkr\u00e9tn\u00edmu \u00fa\u010delu. Nej\u010dast\u011bji se jedn\u00e1 o str\u00e1nku, kter\u00e1 reprezentuje samostatn\u00fd produkt, nebo slu\u017ebu. Landing page tak\u00e9 b\u00fdv\u00e1 \u010dasto myln\u011b ozna\u010dovan\u00e1 jako domovsk\u00e1, co\u017e nen\u00ed pravda. Jak\u00fd je rozd\u00edl mezi landing page a home page? Landing page se d\u00e1 oproti home page jednodu\u0161e rozpoznat. Krom\u011b v\u00fd\u0161e zm\u00edn\u011bn\u00fdch bod\u016f<\/p>\n","protected":false},"author":1,"featured_media":9171,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_uag_custom_page_level_css":"","footnotes":""},"categories":[30],"tags":[224,460],"class_list":["post-9169","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress","tag-landing-pages","tag-wordpress-2"],"acf":[],"uagb_featured_image_src":{"full":["https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2024\/05\/jak-vytvorit-landing-page-ve-wordpressu.png",1200,800,false],"thumbnail":["https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2024\/05\/jak-vytvorit-landing-page-ve-wordpressu-150x150.png",150,150,true],"medium":["https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2024\/05\/jak-vytvorit-landing-page-ve-wordpressu-300x200.png",300,200,true],"medium_large":["https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2024\/05\/jak-vytvorit-landing-page-ve-wordpressu-768x512.png",640,427,true],"large":["https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2024\/05\/jak-vytvorit-landing-page-ve-wordpressu-1024x683.png",640,427,true],"1536x1536":["https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2024\/05\/jak-vytvorit-landing-page-ve-wordpressu.png",1200,800,false],"2048x2048":["https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2024\/05\/jak-vytvorit-landing-page-ve-wordpressu.png",1200,800,false],"archive-list":["https:\/\/affinite.io\/cs\/wp-content\/uploads\/sites\/2\/2024\/05\/jak-vytvorit-landing-page-ve-wordpressu-400x265.png",400,265,true]},"uagb_author_info":{"display_name":"Affinite","author_link":"https:\/\/affinite.io\/cs\/author\/affinite\/"},"uagb_comment_info":0,"uagb_excerpt":"Landing page je str\u00e1nka, kter\u00e1 slou\u017e\u00ed k jednomu konkr\u00e9tn\u00edmu \u00fa\u010delu. Nej\u010dast\u011bji se jedn\u00e1 o str\u00e1nku, kter\u00e1 reprezentuje samostatn\u00fd produkt, nebo slu\u017ebu. Landing page tak\u00e9 b\u00fdv\u00e1 \u010dasto myln\u011b ozna\u010dovan\u00e1 jako domovsk\u00e1, co\u017e nen\u00ed pravda. Jak\u00fd je rozd\u00edl mezi landing page a home page? Landing page se d\u00e1 oproti home page jednodu\u0161e rozpoznat. Krom\u011b v\u00fd\u0161e zm\u00edn\u011bn\u00fdch bod\u016f","_links":{"self":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts\/9169","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/comments?post=9169"}],"version-history":[{"count":0,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/posts\/9169\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/media\/9171"}],"wp:attachment":[{"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/media?parent=9169"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/categories?post=9169"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/affinite.io\/cs\/wp-json\/wp\/v2\/tags?post=9169"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}