For world peace, liberate Al-Aqsa, eliminate Israel and anyone who is with Israel, they are the real terrorists
Bacakan

Cara membuat landing page di blogger

Hello sobat icloudZer kali ini admin bakalan memberikan informasi mengenai bagaimana caranya membuat tampilan landing page di blogger, penggunaan landing page ini support menu layout jadi lebih mudah untuk di gunakan

Info: Oke sobat icloudZer jika kamu sudah penasaran dengan pembahasan kita kali ini yuk langsung aja kita bahas bersama sama

Landing Page

Apa itu landing page? Landing Page adalah suatu halaman khusus yang di buat dengan tujuan spesifik untuk mengarahkan pelanggan melakukan sebuah aksi tertentu, seperti membeli, memesan, atau pun mengisi formulir, dan landing page biasanya di gunakan oleh website penyedia jasa ataupun jual beli barang online sehingga harus menggunakan landing page di dalam website nya

Tampilan Beranda

Seperti kebanyakan pengguna landing page selalu menampilkan landing page pada halaman utama alias halaman beranda atau yang lebih di kenal sebagai Home alias rumah, mengapa landing page di tampilkan di halaman beranda? memang landing page seharusnya di tampilkan pada halaman beranda dan tidak semestinya juga harus pada halaman beranda, soalnya kebayakan landing page mencampur fungsi postingan dan landing page secara bersamaan

Support tampilan layout

Landing page yang bakalan admin jelaskan sebentar lagi ini sangat support pada penggunaan menu layout alias menu Tata letak, jadi kamu bisa mengedit tampilan landing page dengan mudah keinginan kamu

Contoh Tampilan

Jika kamu penasaran dengan Contoh tampilan dari landing page di blogger kamu bisa melihat contoh tampilan dari landing page berikut ini

Keunggulan template ICloudice

  • Loading lebih cepat

    Dioptimalkan dengan memperkecil ukuran template seperti kompres CSS dan Javascript agar loading lebih cepat

  • SEO Friendly

    Template didesain SEO Friendly mulai dari breadcrumb yang sudah terindex google sampai schema markup lainnya

  • Fully Responsive

    Ukuran template flesibel menyesuaikan disetiap layar serta layout yang disusun rapi dengan memaksimalkan kinerja CSS

  • Dioptimalkan untuk iklan

    Sudah disediakan slot iklan adsense yang siap pakai pada lokasi dengan click rate tinggi

  • Lebih mudah digunakan

    Sangat mudah untuk mengubah warna, lebar sampai font melalui Desainer Tema Blogger termasuk pengaturan widget pada menu Layout

Info: Tampilan di atas merupakan contoh tampilan dari landing page selebihnya kamu bisa tambahkan sendiri aja hehehehe

Cara penggunaan

Baiklah sekarang saatnya admin bakalan menjelaskan mengenai bagaimana caranya membuat tampilan landing page di blogger terbaru saa ini, baca dan pelajari artikel berikut ini hingga selesai ok

Kode CSS

Seperti biasanya langkah pertama yang bisa kamu lakukan untuk membuat landing page di blogger kamu bisa menyalin kode CSS di bawah ini kemudian kamu bisa meletakkan nya di atas kode ]]>/b:skin>

.__rahlanding ul.__rah-page{display:flex;flex-wrap:wrap;margin:40px 0 0}
.__rahlanding ul.__rah-page li{width:33.333%;padding:0 45px;margin-bottom:30px;left:0;right:0;display:block;text-align:center}
.__rahlanding ul.__rah-page li > *{margin:0 auto}
.__rahlanding ul.__rah-page svg{width:45px;height:45px;fill:#767676;margin-bottom:25px}
.__rahlanding ul.__rah-page svg.line{fill:none;stroke:#767676}
.__rahlanding ul.__rah-page .t strong{font-size:1.2rem;font-family:'Rubik', sans-serif;font-weight:900}
.__rahlanding ul.__rah-page .t p{font-size:inherit;font-family:inherit;line-height:1.7em;opacity:.8}
.__rah-landing-cnt{position:relative;padding-top:80px;padding-bottom:80px}.__rah-page-inner .__rah-landing-cnt{background:var(--body-round)}
.__rah-page-inner .widget .title{text-align:center}
.__rah-page-inner .widget .title:after{display:none}@media screen and (max-width:896px){.__rahlanding ul.__rah-page li{width:50%}}@media screen and (max-width:640px){
.__rahlanding ul.__rah-page li{width:100%}}

Info: Atau kamu bisa menggunakan tag kode <style> untuk meletakkan kode CSS di atas

Kode HTML

Langkah selanjutnya untuk menampilkan landing page tersebut kamu bisa langsung menyalin kode CSS di bawah ini sesuai keinginan kamu aja

<b:if cond='data:view.isHomepage'>
<div class='__rahlanding'>
<b:section id='__rahlanding' showaddelement='true'>
<b:widget id='HTML053' locked='false' title='Rah Landing Page' type='HTML' version='2' visible='true'>
<b:widget-settings>
<b:widget-setting name='content'>&lt;div class=&#39;secIn&#39;&gt;
&lt;div class=&#39;widget HTML&#39;&gt;
&lt;div class=&#39;content&#39;&gt;
&lt;h2 class=&#39;title&#39;&gt;Keunggulan template ICloudice&lt;/h2&gt;
&lt;ul class=&#39;__rah-page&#39;&gt;
&lt;li&gt;
&lt;!--[ Icon SVG ]--&gt;
&lt;svg viewbox=&#39;0 0 48 48&#39;&gt;&lt;path d=&#39;M45,10H44V9a2.9,2.9,0,0,0-3-3H24V5a3,3,0,0,0-3-3H3A3,3,0,0,0,0,5V45a3,3,0,0,0,3,3H45a3,3,0,0,0,3-3V13A3,3,0,0,0,45,10ZM24,8H41a.9.9,0,0,1,1,1v1H24ZM46,45a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V5A1,1,0,0,1,3,4H21a1,1,0,0,1,1,1v5H12v2H45a1,1,0,0,1,1,1Z&#39;/&gt;&lt;path d=&#39;M30,19v2h3.59l-7,7H18a1,1,0,0,0-.71.29l-6,6,1.41,1.41L18.41,30H27a1,1,0,0,0,.71-.29L35,22.41V26h2V20a1,1,0,0,0-1-1Z&#39;/&gt;&lt;/path&gt;&lt;/path&gt;&lt;/svg&gt;
&lt;div class=&#39;t&#39;&gt;
&lt;strong&gt;Loading lebih cepat&lt;/strong&gt;
&lt;p&gt;Dioptimalkan dengan memperkecil ukuran template seperti kompres CSS dan Javascript agar loading lebih cepat&lt;/p&gt;
&lt;/div&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;!--[ Icon SVG ]--&gt;
&lt;svg viewbox=&#39;0 0 48 48&#39;&gt;&lt;path d=&#39;M45,10H44V9a2.9,2.9,0,0,0-3-3H24V5a3,3,0,0,0-3-3H3A3,3,0,0,0,0,5V45a3,3,0,0,0,3,3H45a3,3,0,0,0,3-3V13A3,3,0,0,0,45,10ZM24,8H41a.9.9,0,0,1,1,1v1H24ZM46,45a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V5A1,1,0,0,1,3,4H21a1,1,0,0,1,1,1v5H12v2H45a1,1,0,0,1,1,1Z&#39;/&gt;&lt;path d=&#39;M30,19v2h3.59l-7,7H18a1,1,0,0,0-.71.29l-6,6,1.41,1.41L18.41,30H27a1,1,0,0,0,.71-.29L35,22.41V26h2V20a1,1,0,0,0-1-1Z&#39;/&gt;&lt;/path&gt;&lt;/path&gt;&lt;/svg&gt;
&lt;div class=&#39;t&#39;&gt;
&lt;strong&gt;SEO Friendly&lt;/strong&gt;
&lt;p&gt;Template didesain SEO Friendly mulai dari breadcrumb yang sudah terindex google sampai schema markup lainnya&lt;/p&gt;
&lt;/div&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;!--[ Icon SVG ]--&gt;
&lt;svg viewbox=&#39;0 0 48 48&#39;&gt;&lt;path d=&#39;M45,10H44V9a2.9,2.9,0,0,0-3-3H24V5a3,3,0,0,0-3-3H3A3,3,0,0,0,0,5V45a3,3,0,0,0,3,3H45a3,3,0,0,0,3-3V13A3,3,0,0,0,45,10ZM24,8H41a.9.9,0,0,1,1,1v1H24ZM46,45a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V5A1,1,0,0,1,3,4H21a1,1,0,0,1,1,1v5H12v2H45a1,1,0,0,1,1,1Z&#39;/&gt;&lt;path d=&#39;M30,19v2h3.59l-7,7H18a1,1,0,0,0-.71.29l-6,6,1.41,1.41L18.41,30H27a1,1,0,0,0,.71-.29L35,22.41V26h2V20a1,1,0,0,0-1-1Z&#39;/&gt;&lt;/path&gt;&lt;/path&gt;&lt;/svg&gt;
&lt;div class=&#39;t&#39;&gt;
&lt;strong&gt;Fully Responsive&lt;/strong&gt;
&lt;p&gt;Ukuran template flesibel menyesuaikan disetiap layar serta layout yang disusun rapi dengan memaksimalkan kinerja CSS&lt;/p&gt;
&lt;/div&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;!--[ Icon SVG ]--&gt;
&lt;svg viewbox=&#39;0 0 48 48&#39;&gt;&lt;path d=&#39;M45,10H44V9a2.9,2.9,0,0,0-3-3H24V5a3,3,0,0,0-3-3H3A3,3,0,0,0,0,5V45a3,3,0,0,0,3,3H45a3,3,0,0,0,3-3V13A3,3,0,0,0,45,10ZM24,8H41a.9.9,0,0,1,1,1v1H24ZM46,45a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V5A1,1,0,0,1,3,4H21a1,1,0,0,1,1,1v5H12v2H45a1,1,0,0,1,1,1Z&#39;/&gt;&lt;path d=&#39;M30,19v2h3.59l-7,7H18a1,1,0,0,0-.71.29l-6,6,1.41,1.41L18.41,30H27a1,1,0,0,0,.71-.29L35,22.41V26h2V20a1,1,0,0,0-1-1Z&#39;/&gt;&lt;/path&gt;&lt;/path&gt;&lt;/svg&gt;
&lt;div class=&#39;t&#39;&gt;
&lt;strong&gt;Dioptimalkan untuk iklan&lt;/strong&gt;
&lt;p&gt;Sudah disediakan slot iklan adsense yang siap pakai pada lokasi dengan click rate tinggi&lt;/p&gt;
&lt;/div&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;!--[ Icon SVG ]--&gt;
&lt;svg viewbox=&#39;0 0 48 48&#39;&gt;&lt;path d=&#39;M45,10H44V9a2.9,2.9,0,0,0-3-3H24V5a3,3,0,0,0-3-3H3A3,3,0,0,0,0,5V45a3,3,0,0,0,3,3H45a3,3,0,0,0,3-3V13A3,3,0,0,0,45,10ZM24,8H41a.9.9,0,0,1,1,1v1H24ZM46,45a1,1,0,0,1-1,1H3a1,1,0,0,1-1-1V5A1,1,0,0,1,3,4H21a1,1,0,0,1,1,1v5H12v2H45a1,1,0,0,1,1,1Z&#39;/&gt;&lt;path d=&#39;M30,19v2h3.59l-7,7H18a1,1,0,0,0-.71.29l-6,6,1.41,1.41L18.41,30H27a1,1,0,0,0,.71-.29L35,22.41V26h2V20a1,1,0,0,0-1-1Z&#39;/&gt;&lt;/path&gt;&lt;/path&gt;&lt;/svg&gt;
&lt;div class=&#39;t&#39;&gt;
&lt;strong&gt;Lebih mudah digunakan&lt;/strong&gt;
&lt;p&gt;Sangat mudah untuk mengubah warna, lebar sampai font melalui Desainer Tema Blogger termasuk pengaturan widget pada menu Layout&lt;/p&gt;
&lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<div class='pG __rah-page-inner'>
<div class='__rah-landing-cnt'>
<data:content/>
</div>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
</b:if>

Info: Taruh di mana kamu ingin menampilkan landing page tersebut

Petunjuk

Jika kamu masih bingung meletakkan kode HTML yang saya berikan di atas kamu bisa mencari kode <b:section kemudian jika sudah ketemu letakkan kode HTML nya tepat diatas kode <b:section atau juga kamu bisa meletakkan kode HTML yang saya berikan di bawah tag kode penutup dari <b:section yakni </b:section, jika masih bingung silahkan hubungi admin melalui WhatsApp ataupun pada kolom komentar, semoga bermanfaat

About the Author

Keindahanmu akan kuabadikan disetiap karyaku.

Post a Comment

Menghasilkan uang melalui survei berbayar
Best Viral Premium Blogger Templates from Icloudice


kami menawarkan berbagai template blogger dan produk istimewa untuk anda, support karya anak bangsa dengan membeli produk yang kami jual

Welcome to my store limited

  • Download theme blogger mirip xmlthemes

    Template mirip xmlthemes

    Template blogger terlaris nomor 1 di seluruh Indonesia bahkan di seluruh dunia lagi Diskon 50%
    Rp.153.000
  • Download theme blogger mirip xmlthemes

    Template mirip xmlthemes

    Template blogger terlaris nomor 1 di seluruh Indonesia bahkan di seluruh dunia lagi Diskon 50%
    Rp.153.000
  • Download theme blogger mirip xmlthemes

    Template mirip xmlthemes

    Template blogger terlaris nomor 1 di seluruh Indonesia bahkan di seluruh dunia lagi Diskon 50%
    Rp.153.000
  • Download theme blogger mirip xmlthemes

    Template mirip xmlthemes

    Template blogger terlaris nomor 1 di seluruh Indonesia bahkan di seluruh dunia lagi Diskon 50%
    Rp.153.000
  • Download theme blogger mirip xmlthemes

    Template mirip xmlthemes

    Template blogger terlaris nomor 1 di seluruh Indonesia bahkan di seluruh dunia lagi Diskon 50%
    Rp.153.000
  • Cookie Consent
    We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
    Oops!
    It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
    AdBlock Detected!
    We have detected that you are using adblocking plugin in your browser.
    The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
    Site is Blocked
    Sorry! This site is not available in your country.