Cara Mengonfigurasi Fitur Product Post Generator

Table of Contents

Generator

<div class="gmp_alert alert_info">
  <div class="alert_message">
    Baca: <a href="#" rel="nofollow noopener" target="_blank">Cara Menggunakan Fitur Product Post Generator</a>
  </div>
</div>

<div class="gmp_tpg">
	<section class="gmp_ppg_info_product">
		<h3>Nama Produk <code>Wajib</code></h3>
		<p>Pastikan produkmu tidak melanggar Hak Kekayaan Intelektual agar produkmu tidak dihapuskan atau diturunkan.</p>

		<div class="gmp_ppg_detail">
			<input class="custom_input" autocomplete="off" placeholder="Contoh: Gila Material Pro (GMP) - Best Premium E-commerce Blogger Template" type="text"/>
		</div>
	</section>

	<section class="gmp_ppg_info_label">
		<h3>Label Produk</h3>
		<p>Silakan pilih warna label produk yang diinginkan dan masukkan nama label sesuai dengan kebutuhanmu.</p>

		<div class="gmp_ppg_detail">
			<label>Warna Label</label>
			<div class="gmp_ppg_info_list">
				<ul>
					<li data-color="color_1"><span></span></li>
					<li data-color="color_2"><span></span></li>
				</ul>
			</div>
			<label>Nama Label</label>
			<input class="custom_input disabled" autocomplete="off" placeholder="Contoh: Produk Terlaris" type="text"/>
		</div>
	</section>

	<section class="gmp_ppg_photo">
		<h3>Foto Produk <code>Wajib</code></h3>
		<p>Format gambar .jpg .jpeg .png .webp dan ukuran minimum 300 x 300 px (Untuk gambar optimal gunakan ukuran minimum 700 x 700 px).</p>

		<div class="gmp_alert alert_info">
		  <div class="alert_message">
		    Masukkan maks. 6 foto produk.
		  </div>
		</div>

		<div class="gmp_ppg_detail">
			<button class="add_image_input gmp_button small fab extended outlined fwm c" type="button">
				<svg fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke="currentColor" viewbox="0 0 24 24"><path d="M12 5v14"></path><path d="M5 12h14"></path></svg>
				Tambah foto produk
			</button>
		</div>
	</section>

	<section class="gmp_ppg_detail_product">
		<h3>Detail Produk</h3>
		<p>Tambah informasi detail produkmu.</p>

		<div class="gmp_alert alert_info">
		  <div class="alert_message">
		    Masukkan maks. 4 detail produk.
		  </div>
		</div>

		<div class="gmp_ppg_detail">
			<button class="add_detail_pdp_input gmp_button small fab extended outlined fwm c" type="button">
				<svg fill="currentColor" viewBox="0 0 24 24"><path d="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z"></path></svg>
				Tambah detail produk
			</button>
		</div>
	</section>

	<section class="gmp_ppg_cta_button">
		<h3>Call-to-Action Button</h3>
		<p>Tambah Call-to-Action button untuk mengarahkan pengguna kepada tujuan konversi.</p>

		<div class="gmp_alert alert_info">
		  <div class="alert_message">
		    Masukkan maks. 4 Call-to-Action button.
		  </div>
		</div>

		<div class="gmp_ppg_detail">
			<button class="add_cta_button_input gmp_button small fab extended outlined fwm c" type="button">
				<svg fill="currentColor" viewBox="0 0 24 24"><path d="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z"></path></svg>
				Tambah Call-to-Action button
			</button>
		</div>
	</section>

	<section class="gmp_ppg_variant">
		<h3>Varian Produk</h3>
		<p>Tambah varian agar pembeli dapat memilih produk yang sesuai.</p>

		<div class="gmp_alert alert_info">
		  <div class="alert_message">
		    Masukkan maks. 3 tipe varian.
		  </div>
		</div>

		<div class="gmp_ppg_detail">
			<button class="add_variant_input gmp_button small fab extended outlined fwm c" type="button">
				<svg fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="1" stroke="currentColor" viewbox="0 0 24 24"><path d="M12 5v14"></path><path d="M5 12h14"></path></svg>
				Tambah varian produk
			</button>

		</div>
	</section>

	<section class="gmp_ppg_price">
		<h3>Harga <code>Wajib</code></h3>
		<p>Atur jumlah harga.</p>

		<div class="gmp_ppg_detail">
			<div class="label_p">
				<label>Harga Satuan</label>
				<span>Rp</span>
				<input class="custom_input" autocomplete="off" placeholder="Harga" type="number"/>
			</div>
			<div class="label_p">
				<label>Harga Diskon</label>
				<span>Rp</span>
				<input class="custom_input" autocomplete="off" placeholder="Harga" type="number"/>
			</div>
			<div class="label_p">
				<label>Diskon</label>
				<span>%</span>
				<input class="custom_input" autocomplete="off" placeholder="0" disabled="" type="number"/>
			</div>
		</div>
	</section>

	<section class="gmp_ppg_description">
		<h3>Deskripsi Produk</h3>
		<p>Pastikan deskripsi produk memuat penjelasan detail terkait produkmu agar pembeli mudah mengerti dan menemukan produkmu.</p>

		<div class="gmp_alert alert_warning">
		  <div class="alert_message">
		    Disarankan untuk <b>tidak memasukkan</b> info nomor HP, e-mail, dsb. ke dalam deskripsi produk untuk melindungi data pribadimu.
		  </div>
		</div>

		<div class="gmp_ppg_detail">
			<div class="gmp_ppg_tab">
				<label>Tab 1</label>
				<input class="custom_input" autocomplete="off" placeholder="Contoh: Deskripsi" type="text"/>
					<textarea class="custom_textarea" placeholder="Konten"></textarea>
			</div>
			<div class="gmp_ppg_tab">
				<label>Tab 2</label>
				<input class="custom_input" autocomplete="off" placeholder="Contoh: Fitur Template" type="text"/>
					<textarea class="custom_textarea" placeholder="Konten"></textarea>
			</div>
			<div class="gmp_ppg_tab">
				<label>Tab 3</label>
				<input class="custom_input" autocomplete="off" placeholder="Contoh: Catatan Perubahan" type="text"/>
					<textarea class="custom_textarea" placeholder="Konten"></textarea>
			</div>
			<div class="gmp_ppg_tab">
				<label>Tab 4</label>
				<input class="custom_input" autocomplete="off" placeholder="Contoh: Info Penting" type="text"/>
					<textarea class="custom_textarea" placeholder="Konten"></textarea>
			</div>
		</div>
	</section>

	<section class="gmp_ppg_result">
		<h3>Hasil Kode</h3>
		<p>Hasil kode generator ini harus ditempelkan pada postingan dalam mode <b>Tampilan HTML</b>.</p>

		<div class="gmp_ppg_detail">
			<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>
			<div class="gmp_highlight hidden">
			  <pre data-lang="&lt;/&gt;"><code>Output Generate HTML</code></pre>
			</div>
		</div>
	</section>
</div>

Product Post

Nama Produk: Menu ini digunakan untuk memasukkan nama produk yang akan Anda jual. Nama produk sebaiknya mencerminkan karakteristik atau keunikan dari produk tersebut.
Label Produk: Label produk adalah informasi tambahan yang dapat membantu mengidentifikasi atau mengelompokkan produk. Misalnya, Anda dapat menggunakan label seperti "Terlaris," "Baru," atau "Diskon" untuk menarik perhatian pelanggan.
Foto Produk: Anda dapat memasukkan foto produk di menu ini. Pilihlah gambar yang berkualitas tinggi dan menampilkan produk dengan jelas agar calon pembeli dapat melihat dengan jelas tampilan produk yang ditawarkan.

Anda dapat menambahkan maks. 6 foto produk.
Detail Produk: Anda dapat menampilkan informasi detail produk.

Anda dapat menambahkan maks. 4 detail produk.

Menambahkan Detail Produk

Keterangan:
1: Menambahkan detail produk baru.

Mengisi Data Detail Produk

Keterangan:
1: Masukkan detail produk kiri, contoh: Nama produk.
2: Masukkan detail produk kanan, contoh: Gila Material Pro (GMP).
3: Menghapus detail produk.
4: Menambahkan detail produk baru.
Varian Produk: Jika produk Anda memiliki beberapa tipe varian, Anda dapat mengisi menu ini dengan informasi varian yang relevan. Misalnya, jika Anda menjual produk virtual, varian produk dapat berupa lisensi atau masa aktif. Anda dapat menambahkan hingga tiga tipe varian dalam Tool Generator Produk ini.

Anda dapat menambahkan maks. 3 tipe varian produk.

Jika mengaktifkan fitur Varian Produk, maka Harga Satuan akan dinonaktifkan.

Menambahkan Tipe Varian Produk

Keterangan:
1: Menambahkan tipe varian produk baru.

Mengisi Data Varian Produk

Keterangan:
1: Masukkan judul tipe varian, contoh: Lisensi.
2: Masukkan judul menu varian, contoh: Standar, Premium, Bisnis. Tambahkan tanda , setiap ingin menambahkan menu varian baru.
3: Menghapus tipe varian.
4: Menambahkan tipe varian baru.
5: Menampilkan judul tipe varian.
6: Menampilkan judul menu varian.
7: Masukkan harga reguler, contoh: 250000 akan menjadi Rp250.000.
8: Masukkan harga diskon, contoh: 225000 harga setelah diskon akan menjadi Rp225.000 (Opsional).
9: Menampilkan persentase diskon.

Contoh Hasil Setelah Diisi
Harga Satuan: Menu ini digunakan untuk memasukkan harga satuan produk. Tetapkan harga yang sesuai dengan nilai produk dan bandingkan dengan harga pasar untuk memastikan daya saing produk Anda.
Deskripsi Produk: Deskripsi produk digunakan untuk memberikan informasi lebih detail tentang produk. Jelaskan fitur produk, manfaat, atau bahan yang digunakan. Gunakan bahasa yang menarik dan jelas agar calon pembeli dapat dengan mudah memahami nilai dari produk yang Anda tawarkan.
Hasil Kode: Setelah Anda mengisi semua informasi produk yang diperlukan di menu sebelumnya, Tool Generator Produk akan menghasilkan kode atau format yang sesuai untuk digunakan dalam postingan mode Tampilan HTML. Anda dapat meng-copy dan paste hasil kode ini ke dalam postingan mode Tampilan HTML Anda agar produk Anda tampil dengan informasi yang lengkap dan terstruktur.

Jika Anda ingin melaporkan beberapa bug, Anda dapat menuliskannya di bagian komentar pada halaman Bug Report dan jika Anda ingin meminta fitur baru atau ingin memberikan umpan balik, silakan tuliskan di bagian komentar pada halaman Request dan Feedback.