{"id":16510,"date":"2019-01-24T11:30:48","date_gmt":"2019-01-24T16:30:48","guid":{"rendered":"https:\/\/www.boldgrid.com\/support\/?p=16510"},"modified":"2021-06-25T15:53:32","modified_gmt":"2021-06-25T19:53:32","slug":"page-builder-setup","status":"publish","type":"post","link":"https:\/\/www.boldgrid.com\/support\/page-builder\/page-builder-setup\/","title":{"rendered":"How to Setup the Post and Page Builder"},"content":{"rendered":"<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/REC-html40\/loose.dtd\">\n<?xml encoding=\"utf-8\" ?><html><body><p>After installing the WordPress <strong>Post and <a href=\"https:\/\/www.boldgrid.com\/wordpress-page-builder-by-boldgrid\/\">Page Builder plugin<\/a><\/strong>, you will be prompted to complete the setup. In this guide, we will walk you through the Post and Page Builder setup steps. While you can skip this setup and use the default settings, we recommend choosing your preferences.<\/p>\n<p><a name=\"setup\"><\/a><\/p>\n<h2 id=\"post-and-page-builder-setup\">Post and Page Builder Setup<\/h2>\n<ol>\n<li><b>Create<\/b> or <b>Edit<\/b> a Page or Post after installing the Post and Page Builder plugin.\n<div style=\"clear: both;\"><\/div>\n<\/li>\n<li><a href=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/okay-lets-go.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignright size-medium wp-image-16512\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/okay-lets-go-300x145.png\" alt=\"\" width=\"300\" height=\"145\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/okay-lets-go-300x145.png 300w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/okay-lets-go-250x121.png 250w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/okay-lets-go-550x266.png 550w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/okay-lets-go-372x180.png 372w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/okay-lets-go.png 607w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a>A notification will &ldquo;<em>Welcome you to the BoldGrid Post &amp; Page Builder<\/em>&rdquo; click the <b>Okay, Lets Go!<\/b> button.\n<div style=\"clear: both;\"><\/div>\n<\/li>\n<li><a href=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/select-editor.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignright size-medium wp-image-16514\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/select-editor-300x283.png\" alt=\"\" width=\"300\" height=\"283\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/select-editor-300x283.png 300w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/select-editor-250x235.png 250w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/select-editor-550x518.png 550w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/select-editor-191x180.png 191w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/select-editor-319x300.png 319w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/select-editor-531x500.png 531w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/select-editor.png 566w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a>You will then be prompted to select your preferred editor for <b>Posts<\/b> and <b>Pages<\/b>. Click the drop-down box and choose from <b>Post and Page Builder<\/b>, <b>WordPress Editor<\/b>, <b>Classic Editor<\/b>, and <b>Default<\/b>.\n<div style=\"clear: both;\"><\/div>\n<\/li>\n<li><a href=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/editor-selected.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignright size-medium wp-image-16515\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/editor-selected-300x233.png\" alt=\"\" width=\"300\" height=\"233\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/editor-selected-300x233.png 300w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/editor-selected-250x194.png 250w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/editor-selected-550x427.png 550w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/editor-selected-232x180.png 232w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/editor-selected-386x300.png 386w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/editor-selected.png 559w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a>Click the <b>Next Step<\/b> button.\n<div style=\"clear: both;\"><\/div>\n<\/li>\n<li><a href=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/default-template.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignright size-medium wp-image-16516\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/default-template-192x300.png\" alt=\"\" width=\"192\" height=\"300\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/default-template-192x300.png 192w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/default-template-250x390.png 250w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/default-template-115x180.png 115w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/default-template-320x500.png 320w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/default-template.png 357w\" sizes=\"auto, (max-width: 192px) 100vw, 192px\" \/><\/a>You will then be prompted to choose your default template. Options are <em>Full Width<\/em> (Recommended)&lt; <em>Right Sidebar<\/em>, <em>Left Sidebar<\/em>, and <em>Theme Default<\/em>. Click the <b>Next Step<\/b> button once you have made your selection.\n<div style=\"clear: both;\"><\/div>\n<p><a href=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/post-page-builder-setup.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignright size-medium wp-image-16517\" src=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/post-page-builder-setup-300x145.png\" alt=\"\" width=\"300\" height=\"145\" srcset=\"https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/post-page-builder-setup-300x145.png 300w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/post-page-builder-setup-250x121.png 250w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/post-page-builder-setup-372x180.png 372w, https:\/\/www.boldgrid.com\/support\/wp-content\/uploads\/2019\/01\/post-page-builder-setup.png 533w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a>A message stating &ldquo;<em>You&rsquo;re Done!<\/em>&rdquo; will display. Click the <b><a href=\"\/support\/page-builder\/\">BoldGrid Post &amp; Page Builder<\/a><\/b> link to access our full guides, or click the <b>Okay, Got It!<\/b> button to begin using the editor.<\/p>\n<div style=\"clear: both;\"><\/div>\n<\/li>\n<\/ol>\n<h2 id=\"how-to-enable-the-post-and-page-builder-for-custom-post-types\">How to Enable the Post and Page Builder for Custom Post Types<\/h2>\n<p>One of the great things about WordPress is the huge variety of high-quality plugins out there to extend WordPress. One of the ways that many plugins accomplish this is with <strong>Custom Post Types<\/strong>.<\/p>\n<p>For example, WooCommerce uses a Custom Post Type called `product` to represent items for sale. However, when you edit a WooCommerce Product, you&rsquo;re limited to using the Classic Editor for the product&rsquo;s description. Here&rsquo;s how you can enable the Post and Page Builder to work with WooCommerce Products, or any Custom Post Type that uses a visual editor field for its main content.<\/p>\n<div class=\"video-responsive\"><iframe loading=\"lazy\" title=\"Use the BoldGrid Page Builder for WooCommerce Products (or any Custom Post Type!)\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/Wr5jYjBs0KQ?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/div>\n<h3 id=\"override-the-post-and-page-builder-configuration\">Override the Post and Page Builder Configuration<\/h3>\n<p class=\"alert alert-warning\">To make these changes, you will need to modify some files in your WordPress installation. Be sure you <a href=\"https:\/\/www.boldgrid.com\/support\/total-upkeep\/backup-wordpress-website\/\">make a backup<\/a> before proceeding, just to be safe.<\/p>\n<ol>\n<li>Locate the file <code>\/wp-content\/plugins\/post-and-page-builder\/includes\/config\/config.sample.php<\/code> and copy it to <code>config.local.php<\/code> in the same directory.<\/li>\n<li>Delete the line <code>'asset_server'   =&gt; 'https:\/\/wp-assets-dev.boldgrid.com',<\/code><\/li>\n<li>In its place, add the line <code>'allowed_post_types'    =&gt; array( 'page', 'post', 'bg_block', 'crio_page_header', 'product' ),<\/code>. This example uses <strong>&lsquo;product&rsquo;<\/strong>, the slug for WooCommerce Products, but you can use the slug for your custom post type.<\/li>\n<li>Save the changes<\/li>\n<\/ol>\n<p>When you edit your Custom Post Type, you&rsquo;ll now see the Post and Page Builder for the editor interface.<\/p>\n<p>Congratulations, now you know how to set up the BoldGrid Post &amp; Page Builder! Now, you can begin using the tools to build a beautiful website.<\/p>\n<\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>After installing the WordPress Post and Page Builder plugin, you will be prompted to complete the setup. In this guide, we will walk you through the Post and Page Builder setup steps. While you can skip this setup and use the default settings, we recommend choosing your preferences. Post and Page Builder Setup Create or [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"bgseo_title":"","bgseo_description":"","bgseo_robots_index":"index","bgseo_robots_follow":"follow","footnotes":""},"categories":[148],"tags":[679],"class_list":["post-16510","post","type-post","status-publish","format-standard","hentry","category-page-builder","tag-page-builder","feature-type-free","experience-level-getting-started"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/16510","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/comments?post=16510"}],"version-history":[{"count":10,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/16510\/revisions"}],"predecessor-version":[{"id":39817,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/posts\/16510\/revisions\/39817"}],"wp:attachment":[{"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/media?parent=16510"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/categories?post=16510"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.boldgrid.com\/support\/wp-json\/wp\/v2\/tags?post=16510"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}