Cara Mengonfigurasi Fitur Hero Section Generator

Table of Contents

Generator
Hero Section

Generator

Place this code in the Blogger Page menu with the title Hero Section Generator .

<div class="gmp_alert alert_info">
	<div class="alert_message">
		Baca: <a href="#" rel="nofollow noopener" target="_blank">Cara Mengonfigurasi Fitur Hero Section Generator</a>
	</div>
</div>

<section class="gmp_generator_hero_section">
		<div class="gmp_generator_detail">
			<h3>Judul</h3>
			<input class="custom_input ih1" autocomplete="off" placeholder="Contoh: Best Blogger Template Collection &lt;br/&gt; Suits Your Style." type="text"/>

			<div class="hr"></div>

			<h3>Subjudul</h3>
			<input class="custom_input ih2" autocomplete="off" placeholder="Contoh: We have just released a new collection of templates with an Online Store concept. &lt;br/&gt; If you are interested, you can press the &lt;b&gt;See products&lt;/b&gt; button below to find out more information." type="text"/>

			<div class="hr"></div>

			<h3>Call to Action</h3>
			<h4>Primary</h4>
			<p>Label Tombol</p>
			<input class="custom_input ih3" autocomplete="off" placeholder="Contoh: Browse Templates" type="text"/>
			<p>Tautan/URL</p>
			<input class="custom_input ih4" autocomplete="off" placeholder="Contoh: https://..." type="text"/>

			<br><br>

			<h4>Secondary</h4>
			<p>Label Tombol</p>
			<input class="custom_input ih5" autocomplete="off" placeholder="Contoh: See products" type="text"/>
			<p>Tautan/URL</p>
			<input class="custom_input ih6" autocomplete="off" placeholder="Contoh: https://..." type="text"/>

			<div class="hr"></div>

			<h3>Gambar</h3>
			<input class="custom_input ih7" autocomplete="off" placeholder="Contoh: https://..." type="text"/>

			<div class="hr"></div>

			<h3>Hasil Kode</h3>
			<p>Hasil kode generator ini harus ditempelkan pada widget berjudul <b>Hero Section</b>.</p>
			<button class="create_button gmp_button small fab extended filled fwm" type="button">
				<svg fill="currentColor" viewBox="0 0 24 24"><path d="M14.6,16.6L19.2,12L14.6,7.4L16,6L22,12L16,18L14.6,16.6M9.4,16.6L4.8,12L9.4,7.4L8,6L2,12L8,18L9.4,16.6Z"></path></svg>
				Buat kode
			</button>
			<pre class="hidden" data-lang="&lt;/&gt;"><code class="html-language">Output code here</code></pre>
		</div>
	</section>

Hero Section

In the Title column, enter the title text as in the example:
Best Blogger Template Collection <br/> Suits Your Style.
In the Subtitle column, enter the subtitle text as in the example:
We have just released a new collection of templates with an Online Store concept. <br/> If you are interested, you can press the <b>See products</b> button below to find out more information.
In the Call to Action section there are 2 main and secondary buttons.

In the Button Label column , enter the button label text as in the example:
Browse Templates

In the Link/URL column, enter a link like the example:
https://www.gilatemax.com/
In the Image column, enter the image URL, for example:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTLnFqlqeDChw8oGnnR2glVZrHF1dN7FTy2fTM7kxs5DclCAUdy3YC-gZrcm7tqT98y0KAXjA5aZmf_4ywFYiwJi_6Er0J8C8rGOVwFmnCRcYsx8Wp_1e7qXlYRXa-uknLVS4Bly_kEUZP4ZS97kvf1UQfpj6r5spl2H83KOu6ZiJ8R8cXKfNM8yrppgFN/s1600/Asset.png

Recommended image size 1600 x 1024 px .
In the Code Result section , click the Generate code button to generate the HTML code. Paste the code in the Layout widget titled Hero Section .

If you want to report some bugs, you can write them in the comments section on the page.Bug Reportand if you want to request a new feature or want to give feedback, please write it in the comments section on the pageRequest and Feedback.