{"id":17377,"date":"2020-11-26T11:37:02","date_gmt":"2020-11-26T04:37:02","guid":{"rendered":"https:\/\/www.rumahweb.com\/journal\/?p=17377"},"modified":"2022-12-26T16:33:27","modified_gmt":"2022-12-26T09:33:27","slug":"cara-menggunakan-premade-layouts-di-theme-divi","status":"publish","type":"post","link":"https:\/\/www.rumahweb.com\/journal\/cara-menggunakan-premade-layouts-di-theme-divi\/","title":{"rendered":"Cara Menggunakan Premade Layouts di Theme Divi"},"content":{"rendered":"\n<p>Divi merupakan salah satu theme premium yang disediakan oleh Rumahweb secara gratis yang dapat Anda gunakan bila berlangganan paket <a href=\"https:\/\/www.rumahweb.com\/hosting-murah\/\" target=\"_blank\" rel=\"noreferrer noopener\">hosting murah<\/a> baik Shared, Unlimited maupun Cloud Hosting. Salah satu fitur paling penting dari theme Divi yaitu <strong>Premade Layouts<\/strong>. <\/p>\n\n\n\n\n\n<p>Premade Layouts adalah fitur pembuatan Layout pada website berbasis WordPress dengan themes <a href=\"https:\/\/www.rumahweb.com\/journal\/theme-divi\/\" title=\"theme divi\">Divi<\/a>. Dengan fitur ini, anda dapat membuat layout website secara mudah dan cepat. Hanya butuh beberapa klik, website sudah bisa diakses dengan tampilan yang profesional. <\/p>\n\n\n\n<p>Pada panduan ini, kami akan berbagi cara menggunakan premade layouts di themes Divi. Berikut informasi selengkapnya.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Cara Mengakses Premade Layouts Theme Divi<\/h2>\n\n\n\n<p>Anda bisa mengakses dan melakukan import Pre-made Layouts Divi dengan dua cara berikut ini:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Saat membuat new Page<\/li>\n\n\n\n<li>Saat melakukan edit Page<\/li>\n<\/ul>\n\n\n\n<p>Setelah memilih satu dari dua cara tersebut, tekan tombol Use Visual Builder.<\/p>\n\n\n\n<p>Jika Anda membuat Page baru, Anda akan mendapatkan pop up 3 pilhan. Silahkan pilih \u201cChoose A Premade Layout\u201d<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.elegantthemes.com\/documentation\/wp-content\/uploads\/2017\/05\/three-building-options-1.png\" alt=\"image 1 - Cara Menggunakan Premade Layouts di Theme Divi\"\/><\/figure>\n\n\n\n<p>Setelah memilih Anda akan mendapatkan pop up \u201cLoad From <a href=\"https:\/\/www.elegantthemes.com\/documentation\/divi\/divi-library\/\">Library<\/a>\u201d. Pada pop up ini Anda dapat melihat seluruh pre-made layouts yang ada di dalam Divi.<\/p>\n\n\n\n<p class=\"has-large-font-size\"><strong>Premade Layouts, Saved Layouts, dan Existing Pages<\/strong><\/p>\n\n\n\n<p>Pada pop up &#8220;Load From Library&#8221; Anda akan melihat 3 tab yaitu Premade Layouts, Saved Layouts, dan Existing Pages. <\/p>\n\n\n\n<p>Di tab &#8220;Premade Layouts&#8221; Anda dapat melihat seluruh premade layouts yang disediakan oleh Divi (Elegant Themes) yang dapat langsung Anda gunakan.<\/p>\n\n\n\n<p>Di tab \u201cYour Saved Layouts\u201d Anda dapat mengakses seluruh layout yang pernah Anda simpan ke Divi Library.<\/p>\n\n\n\n<p>Sedangkan pada tab \u201cYour Existing Pages\u201d berisi seluruh page (termasuk post dan project) yang ada di dalam WordPress Anda. Anda dapat melakukan clone dari page yang sudah ada untuk page baru yang ingin Anda buat melalui menu ini.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.elegantthemes.com\/documentation\/wp-content\/uploads\/2017\/05\/three-tabs-1.jpg\" alt=\"load from library Divi\"\/><\/figure>\n\n\n\n<h2 class=\"has-large-font-size wp-block-heading\">Menggunakan Premade Layout Theme Divi<\/h2>\n\n\n\n<p>Pada tab Premade Layouts, Anda dapat mencari dengan cara melihat dari list layout packs yang ada. Anda juga dapat melakukan pencarian dan filter berdasarkan kategori yang ada di kolom kiri.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.elegantthemes.com\/documentation\/wp-content\/uploads\/2017\/05\/see-layout-packs.jpg\" alt=\"Premade Layout Theme Divi\"\/><\/figure>\n\n\n\n<p>Setelah memilih salah satu layout pack, Anda dapat melihat preview masing-masing layout halaman yang ada di dalam layout pack tersebut. Ketika melakukan klik pada salah satu page layout maka Anda dapat melihat preview page tersebut di sisi kiri. <\/p>\n\n\n\n<p>Di bawah preview terdapat tombol \u201cview Live Demo\u201d yang jika di klik akan membuka live demo dari page tersebut di tab browser baru. Jika Anda ingin menggunakan layout tersebut, silakan klik tombol \u201cUse This Layout\u201d.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.elegantthemes.com\/documentation\/wp-content\/uploads\/2017\/05\/use-layout.jpg\" alt=\"contoh Premade Layout Theme Divi\"\/><\/figure>\n\n\n\n<p>Ketika Anda sudah pernah menambahkan premade layout, Anda dapat mengakses kembali di Visual Builder baik untuk page baru maupun page yang sudah ada. Caranya yaitu dengan melakukan klik tombol titik tiga berwarna ungu.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.elegantthemes.com\/blog\/wp-content\/uploads\/2018\/07\/setting-icon.jpg\" alt=\"contoh implementasi Premade Layout Theme Divi\"\/><\/figure>\n\n\n\n<p>Setelah klik tombol titik tiga tersebut. Tekan tombol tanda plus, tombol ini merupakan menu &#8220;Load From Library\u201d . Setelah melakukan klik tombol tersebut, akan muncul popup &#8220;Load From Library&#8221; yang akan menampilkan seluruh premade layouts.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.elegantthemes.com\/documentation\/wp-content\/uploads\/2017\/05\/library-icon.jpg\" alt=\"Menu setting Divi \"\/><\/figure>\n\n\n\n<h3 class=\"has-large-font-size wp-block-heading\">Menambahkan Layout atau Melakukan Replace ke Existing Content<\/h3>\n\n\n\n<p>Premade layout dapat Anda tambahkan baik pada halaman kosong, existing layout atau Anda juga bisa melakukan replace existing content. Jika Anda menambahkan premade layout ke existing page, secara default layout akan ditambahkan di page paling bawah. Namun jika Anda ingin mengganti seluruh isi konten dengan premade layout, silahkan klik centang opsi \u201cReplace Existing Content\u201d sebelum melakukan klik  &#8220;use this layout&#8221;.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/www.elegantthemes.com\/blog\/wp-content\/uploads\/2018\/07\/replace-existing-content.jpg\" alt=\"Layout details\" class=\"wp-image-80948\"\/><\/figure>\n<\/div>\n\n\n<h3 class=\"has-large-font-size wp-block-heading\">Memuat Saved Layouts dan Melakukan Cloning Existing Pages<\/h3>\n\n\n\n<p>Jika Anda sudah pernah menyimpan layout ke Divi Library, Anda dapat mengakses layout ini melalui popup Load From Library di tab \u201cYour Saved Layouts\u201d. Untuk memuat Saved Layout, cukup melakukan klik di list saved layout tersebut.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/www.elegantthemes.com\/blog\/wp-content\/uploads\/2018\/07\/saved-layouts.jpg\" alt=\"Saved Layouts \"\/><\/figure>\n\n\n\n<p>Anda juga bisa melakukan clone page dari page yang sebelumnya telah Anda buat. Caranya yaitu dengan mengakses tab \u201cYour Existing Pages\u201d lalu memilih page yang ingin di-clone. Setelah Anda memilih, akan terbentuk page baru berdasarkan page yang Anda pilih.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/www.elegantthemes.com\/blog\/wp-content\/uploads\/2018\/07\/cone-page.jpg\" alt=\"Melakukan Cloning Existing Pages\" class=\"wp-image-80952\"\/><\/figure>\n<\/div>\n\n\n<p>Demikian panduan mengenai <span style=\"text-decoration: underline;\">Premade Layouts di Divi<\/span>. Selamat mencoba! Jika Anda ada kesulitan mengikuti panduan ini, silahkan dapat menghubungi kami melalui chat maupun email ke teknis@rumahweb.com<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Divi merupakan salah satu theme premium yang disediakan oleh Rumahweb secara gratis yang dapat Anda gunakan bila berlangganan paket hosting murah baik Shared, Unlimited maupun Cloud Hosting. Salah satu fitur paling penting dari theme Divi yaitu Premade Layouts. Premade Layouts adalah fitur pembuatan Layout pada website berbasis WordPress dengan themes Divi. Dengan fitur ini, anda [&hellip;]<\/p>\n","protected":false},"author":337,"featured_media":28954,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[463],"tags":[1452,946,1091,1000,14],"class_list":{"0":"post-17377","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-wordpress","8":"tag-divi","9":"tag-panduan-wordpress","10":"tag-setting-wordpress","11":"tag-tutorial-wordpress","12":"tag-wordpress"},"aioseo_notices":[],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/www.rumahweb.com\/journal\/wp-content\/uploads\/2020\/11\/Banner-Cara-Menggunakan-Premade-Layouts-di-Theme-Divi.png","jetpack_shortlink":"https:\/\/wp.me\/p8n3G7-4wh","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/17377","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/users\/337"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/comments?post=17377"}],"version-history":[{"count":0,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/posts\/17377\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media\/28954"}],"wp:attachment":[{"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/media?parent=17377"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/categories?post=17377"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rumahweb.com\/journal\/wp-json\/wp\/v2\/tags?post=17377"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}