diff --git a/beaver-builder/layouts/modules/accordion.mdx b/beaver-builder/layouts/modules/accordion.mdx
index 4de1d99c..1dd41d07 100644
--- a/beaver-builder/layouts/modules/accordion.mdx
+++ b/beaver-builder/layouts/modules/accordion.mdx
@@ -587,3 +587,142 @@ Typography settings control font family, size, weight, line height, letter spaci
The Advanced tab includes all the standard settings for margins, visibility, animations, and advanced HTML configurations.
See the [Advanced tab](../advanced-tab/index.md) section for more information.
+
+## Link to a Specific Item
+
+Learn how to create a link that navigates to a specific accordion item.
+
+### Adding an `ID`
+
+To begin, first assign an `ID` to the Accordion module, which can be accomplished by following the instructions below:
+
+1. Open the Accordion module settings and click the [Advanced tab](../../advanced-tab/index.md).
+
+2. Scroll to the `ID` setting, and set a unique `ID` name for the module.
+ See the [Advanced tab](../../advanced-tab/html-element.md#id) article for more information about `ID` selectors.
+
+3. Save changes.
+
+### Index Values
+
+Every item in the Accordion module is given a unique index value that starts at `0`. The index value of the initial Accordion item is `0`, the second item is assigned an index value of `1`, the third item has an index value of `2`, and so on. By using these index values in an HTML link, you can generate a link to a specific Accordion item and set it as the active item.
+
+The below HTML code example demonstrates how the index values are allocated to each Accordion item. In this instance, the Accordion module has been given a unique ID name of `my-accordion` and consists of three Accordion items.
+
+```html
+
+```
+
+### Link Structure
+
+The link structure will differ based on whether the Accordion module is on the same page as your link. To create the link, you can use either the Button or HTML modules in your layout.
+
+#### Same Page
+
+When the link is on the same page as the Accordion module, you can use a hash character (`#`) followed by an `ID` name and the item's index value separated by a hyphen. For instance, using our example `ID` name of `my-accordion`, the link would be structured as follows:
+
+```html title='Button module link option'
+#my-accordion-1
+```
+
+```html title='HTML module link'
+My Accordion link
+```
+
+#### Different Page
+
+To create a link to the Accordion module from a different page on your website, use the complete URL of the target page along with the hash symbol (`#`) followed by the `ID` and index value. For instance, if you want to add the link to your homepage, and the Accordion module is located on a page named Sample Page, the link should appear like this:
+
+```html title='Button module link option'
+https://my-website.com/sample-page#my-accordion-1
+```
+
+```html title='HTML module link'
+My Accordion link
+```
+
+## CSS Customization
+
+Use this section to learn how custom CSS can extend the Accordion module’s styling beyond the options available in the module settings. The examples below show different ways to customize the appearance of accordion items, labels, icons, and other elements.
+
+:::tip
+The examples below use the Accordion module's `fl-module-accordion` parent class, which, depending on where you add your CSS, will style all Accordion modules used on your website. However, if you wish to customize a specific Accordion module, you should add a custom class name to the module and replace `fl-module-accordion` with the new custom class name.
+
+```css
+.my-custom-class .fl-accordion-item-active {
+ background-color: #f4f4f4;
+}
+```
+
+:::
+
+### Active Accordion Item
+
+The following CSS examples demonstrate how to modify the appearance of the active accordion item. Doing so can increase the visibility in comparison to the inactive items:
+
+#### Background Color
+
+```css
+.fl-module-accordion .fl-accordion-item-active {
+ background-color: #f4f4f4;
+}
+```
+
+#### Label Color
+
+```css
+.fl-module-accordion .fl-accordion-item-active .fl-accordion-button-label {
+ color: #ff0000;
+}
+```
+
+#### Accordion Content Color
+
+```css
+.fl-module-accordion .fl-accordion-item-active .fl-accordion-content {
+ background-color: #f4f4f4;
+ color: #000000;
+}
+```
+
+### Replace Expand/Collapse Icons with Images
+
+You can use the CSS provided below to replace the icons of the collapsed and expanded states in the Accordion module with images of your choice.
+
+```css
+.fl-module-accordion .fl-accordion-button {
+ width: 100%;
+ position: relative;
+}
+
+/* Hide Accordion Icons */
+.fl-module-accordion .fl-accordion-button .fl-accordion-button-icon {
+ display: none;
+}
+
+/* Collapsed Image */
+.fl-module-accordion .fl-accordion-button-label:after {
+ content: '';
+ width: 30px;
+ height: 30px;
+ background-image: url(IMAGE URL);
+ background-size: cover;
+ position: absolute;
+ right: 10px;
+ top: 50%;
+ transform: translateY(-50%);
+}
+
+/* Expanded Image (Active Accordion) */
+.fl-module-accordion .fl-accordion-item-active .fl-accordion-button-label:after {
+ background-image: url(IMAGE URL);
+}
+```
diff --git a/beaver-builder/layouts/modules/contact-form.mdx b/beaver-builder/layouts/modules/contact-form.mdx
index a8d56e84..adb3eedf 100644
--- a/beaver-builder/layouts/modules/contact-form.mdx
+++ b/beaver-builder/layouts/modules/contact-form.mdx
@@ -562,18 +562,63 @@ The Advanced tab includes all the standard settings for margins, visibility, ani
See the [Advanced tab](../advanced-tab/index.md) section for more information.
-## Feature Guides
+## Add a Google reCAPTCHA
-### Set up reCAPTCHA
+Google reCAPTCHA blocks automated spam submissions on the Contact Form and [Subscribe Form](subscribe-form.mdx) modules. You configure it in the module's **Captcha** tab using a key pair from Google. Beaver Builder supports three validation types, so you can choose between a visible checkbox and background scoring.
-Use this workflow when the form needs Google reCAPTCHA protection.
+### Before you begin
-1. Open the **Captcha** tab and set **reCAPTCHA Field** to **Show**.
-2. Choose **Validate Type** based on the submission flow: **"I'm not a robot" checkbox (V2)**, **Invisible (V2)**, or **Invisible (V3)**.
-3. Register the site in the Google reCAPTCHA Admin Console using the same validation type selected in the module.
-4. Use a different key pair for each validation type when the site uses both v2 and v3 forms.
-5. Paste the public key into **Site Key** and the private key into **Secret Key**.
-6. Set **Theme** to **Light** or **Dark** for visible widgets.
-7. If **Validate Type** is **Invisible (V3)**, add an **Action** value that matches the verification flow for that form.
-8. Publish the page and submit the form from the front end.
-9. If verification fails, recheck the selected validation type, hostname, and key pair.
+You need a few things in place before you configure the module.
+
+- A published page that contains a Contact Form or Subscribe Form module.
+- A Google account with access to the [reCAPTCHA admin console](https://www.google.com/recaptcha/admin).
+- The domain name where the form runs, so you can register it with Google.
+
+:::info
+ Each validation type uses a different key pair. If you switch a form between the checkbox and an invisible type, register new keys in the admin console and update the module.
+:::
+
+### Choose a reCAPTCHA type
+
+Pick the validation type that fits how you want visitors to verify themselves. You select the matching type later in the module's **Validate Type** setting.
+
+- **"I'm not a robot" checkbox (v2):** Visitors check a box, and Google may show an image challenge. This is the most visible option and the only one where the **Theme** setting (light or dark) changes the widget's appearance.
+- **Invisible (v2):** No checkbox appears. Verification runs when the visitor submits the form, and Google shows a challenge only when a submission looks suspicious. A reCAPTCHA badge displays in the corner of the page.
+- **Invisible (v3):** Runs silently and returns a score instead of showing a challenge. Beaver Builder accepts submissions that score 0.5 or higher. This type supports an optional **Action** label and also displays a badge.
+
+:::info
+ Google requires the reCAPTCHA badge on invisible (v2 and v3) forms, or a text disclosure that links to Google's [Privacy Policy](https://policies.google.com/privacy) and [Terms of Service](https://policies.google.com/terms).
+:::
+
+### Get your reCAPTCHA keys
+
+Register your site with Google to generate the site key and secret key.
+
+1. Sign in to the [Google reCAPTCHA admin console](https://www.google.com/recaptcha/admin).
+2. Add a label so you can identify the site later.
+3. Select the reCAPTCHA type that matches the validation type you chose: **reCAPTCHA v2 "I'm not a robot" Checkbox**, **reCAPTCHA v2 Invisible badge**, or **reCAPTCHA v3**.
+4. Add your domain. Omit `http://`, `https://`, and any path.
+5. Accept the terms and submit the form.
+6. Copy the **Site Key** and **Secret Key**. Keep the secret key private.
+
+### Add reCAPTCHA to your form
+
+Enter your keys in the module to turn on protection.
+
+1. Open the form module's settings and select the **Captcha** tab.
+2. Set **reCAPTCHA Field** to **Show**.
+3. Set **Validate Type** to the type you registered with Google.
+4. Paste your **Site Key** and **Secret Key**.
+5. For the checkbox type, set **Theme** to **Light** or **Dark**.
+6. For **Invisible (v3)**, optionally enter an **Action** label.
+7. Save the module and publish the page.
+
+### Test your form
+
+Confirm the protection works from the front end after publishing.
+
+1. Open the published page in a logged-out browser or private window.
+2. Complete the form and submit it.
+3. For the checkbox type, confirm the widget appears and must be checked before the form sends.
+4. For invisible types, confirm the badge appears and the form submits without a challenge under normal use.
+5. Verify the notification email arrives at the configured address.
diff --git a/beaver-builder/layouts/modules/gallery.mdx b/beaver-builder/layouts/modules/gallery.mdx
index bea11664..a6af7a56 100644
--- a/beaver-builder/layouts/modules/gallery.mdx
+++ b/beaver-builder/layouts/modules/gallery.mdx
@@ -137,3 +137,69 @@ The border style, width, color, and radius applied to each photo, plus an option
The Advanced tab includes all the standard settings for margins, visibility, animations, and advanced HTML configurations.
See the [Advanced tab](../advanced-tab/index.md) section for more information.
+
+## Gallery Lightbox
+
+The Button module has a built-in lightbox feature, but if you put in the shortcode for a gallery, the entire gallery will display in the lightbox, rather than the individual gallery images.
+
+You can configure the button click to display the individual gallery images in the lightbox, with previous and next navigation, as shown in this screenshot:
+
+
+
+The instructions here will show you how to create a Button module an a Gallery module, add custom IDs, and copy in some jQuery to make it all work.
+
+### 1. Create a Button module
+
+Create your button and give it a custom ID also, using these instructions.
+
+ 1. Drag a Button module into your layout.
+ Leave the Click Action set to **Link** but don't add a link.
+ The link will be set by the jQuery.
+ 2. On the **Advanced** tab in the **HTML element** section, enter an ID for your button in the **ID** field.
+ In this example, we'll use `gallery-1-button` as the ID value.
+ 4. Enter any other style settings you want for the button and save the module.
+
+### 2. Create a Gallery module
+
+Create your gallery and give it a custom ID using these instructions.
+
+ 1. Add a Gallery module to your layout.
+Placing the gallery in a row under the button is a good place. The jQuery will keep the gallery from being displayed on your main page.
+ 2. Add photos to the Gallery module in the normal fashion.
+ 3. On the **General** tab, set **Click action** to **Lightbox** and select the size of image you want to display in the lightbox.
+ 4. On the **Advanced** tab, in the **HTML element** section, enter an ID for your gallery in the **ID** field.
+In this example, we'll use `gallery-1` as the ID value,
+ 5. Save the module.
+
+### 3. Add the jQuery code
+
+Add the jQuery code using the following instructions.
+
+ 1. In the Beaver Builder editor, click the down arrow in the Title bar in the upper left corner to open the **Tools** menu, then choose **Layout CSS & JavaScript**.
+ 2. Click the **JavaScript** tab, then paste in the following code.
+ ```js
+ jQuery(document).ready(function ($) {
+ var galleryid = "#gallery-1"; //Gallery ID
+ var buttonid = "#gallery-1-button"; //Button ID
+
+ if ("undefined" !== typeof FLBuilderConfig) {
+ return;
+ }
+
+ jQuery(galleryid + " .fl-photo-img").hide();
+
+ jQuery(buttonid).on("click", function (e) {
+ e.preventDefault();
+ $(galleryid + " img")
+ .first()
+ .trigger("click");
+ });
+ });
+ ```
+ 3. Change lines 2 and 3 to the ID values that you assigned to the Gallery module and the Button module respectively.
+ 4. Click **Save** to save the code.
+ 5. Publish the page. Hold down the Shift key and click the Refresh icon to clear your browser cache, then test your button.
+
+:::tip
+ If you're using more than one button and gallery lightbox on the same page, duplicate this jQuery code and change the `ID` values to match each button and gallery.
+:::
diff --git a/beaver-builder/layouts/modules/menu.mdx b/beaver-builder/layouts/modules/menu.mdx
index d31c8c8d..c90da249 100644
--- a/beaver-builder/layouts/modules/menu.mdx
+++ b/beaver-builder/layouts/modules/menu.mdx
@@ -854,3 +854,55 @@ Typography settings control font family, size, weight, line height, letter spaci
The Advanced tab includes all the standard settings for margins, visibility, animations, and advanced HTML configurations.
See the [Advanced tab](../advanced-tab/index.md) section for more information.
+
+---
+
+## Link a Menu Item to a Page Section
+
+
+
+
+
+You can add a menu item whose link goes to a specific section on the same page
+or a section on a different page. This works both with menus you set up in your theme and menus in the Beaver Builder Menu module. It's particularly useful for single-page websites where you have a menu for the various sections on that page.
+
+:::info
+If the section is on the same page as the link, there's a smooth scroll to the
+linked section. If the link goes to a section on a different page, there's an
+immediate jump to that section on the other page.
+:::
+
+This technique involves two steps: adding a unique ID (called an *anchor*) to the target section in a Beaver Builder layout, then adding the link with that anchor to your menu.
+
+### 1. Create the anchor for the link target
+
+:::tip
+ You can add the ID to a module, a column, or a row, but the target tends to position best if you add the ID to the row containing the item you want to link to. Also, if the section is near the end of the page, the scrolling may not go all the way down to the section with the ID. This is a property of how browsers handle links to anchors.
+:::
+
+ 1. In the Beaver Builder editor, open the row (or column or module) that you plan to link to.
+ 2. Click the **Advanced** tab and scroll down to the **HTML elements** section.
+ 3. For the **ID** setting, add a unique value such as `my-unique-id`.
+ID values may only contain alphanumeric characters, hyphens, or underscores.
+
+:::tip
+It's a best practice to prefix ID and class values with a namespace. The namespace prefix plays a double role.
+
+First, it helps identify where the ID or class comes from. For example, Beaver Builder uses the namespace `fl-`, so when you're inspecting the HTML source for a page, it's easy to identify the Beaver Builder code as opposed to, say, that of other plugins.
+
+Second, a namespace helps to avoid accidentally using words that are reserved for use in coding languages like [PHP](https://www.php.net/manual/en/reserved.php) and [JavaScript](https://www.w3schools.com/js/js_reserved.asp) or duplicating IDs and classes from other products.
+
+For example, if your business name is Best Website Designs, you might choose `bwd-` as your namespace prefix and your ID value might be `bwd-menutarget-1`. Just make sure each ID value is unique on your site.
+:::
+
+### 2. Add the unique ID to a menu item
+
+ 1. On the WordPress admin menu, click **Appearance > Menus** and make sure the menu you want to use is displayed.
+ 2. In the left column expand the **Custom links** category.
+
+
+ 3. Enter the full URL of the target page in which the section occurs, followed by the pound sign and your ID. For example, if the section occurs on the page *`https://www.example.com/goals/`* , then your URL would be:
+*`https://www.example.com/goals/#my-unique-id`*
+
+ 4. Enter whatever link text you want your menu item to display.
+ 5. Click **Add to menu**.
diff --git a/beaver-builder/layouts/modules/photo.mdx b/beaver-builder/layouts/modules/photo.mdx
index ac3ef633..efa072c5 100644
--- a/beaver-builder/layouts/modules/photo.mdx
+++ b/beaver-builder/layouts/modules/photo.mdx
@@ -231,3 +231,180 @@ Controls how the image fits and positions itself when the wrapper has a fixed wi
The Advanced tab includes all the standard settings for margins, visibility, animations, and advanced HTML configurations.
See the [Advanced tab](../advanced-tab/index.md) section for more information.
+
+## Add hover effects
+
+Using a custom class and some custom CSS, you can add some really cool hover
+effects to images.
+
+
+
+
+
+1. Add a [Photo module](/beaver-builder/layouts/modules/photo/photo.md) to your page.
+2. Configure the Photo module as you normally would.
+3. Click the **Advanced** Tab
+4. In the **HTML element** section, add one of the following values to the **Class** field, depending on which effect you want. See the description of each effect in the sections below.
+
+ - Hover Zoom In: `hover-zoom-in`
+ - Hover Zoom Out: `hover-zoom-out`
+ - Hover Zoom Out and Rotate: `hover-zoom-out-rotate`
+ - Hover Unblur: `hover-unblur`
+ - Grayscale to Color: `gray-scale-img`
+ - Sepia to Color: `sepia-img`
+
+5. Add the CSS for the effect wherever you put your custom CSS.
+ Copy the CSS for the effect you want from one of the following sections and see [this article](basics/custom-code.md) about where to add custom CSS code.
+
+:::tip
+If you have multiple Photo modules in a row and want to apply an effect to the entire set, add the effect’s CSS to the **Class** field on the **Advanced** tab in the row settings rather than the Photo module settings. The effect will apply to every Photo module contained in the row.
+:::
+
+### CSS for hover effects
+
+:::info
+The transition speeds in these CSS examples are set to `.3s`. You can change the
+value to speed up or slow down the effect. For example, `1s` will slow the
+change.
+:::
+
+#### Hover Zoom In
+
+This effect adds a smooth zoom effect when you hover over the image.
+
+```css
+/* Zoom in on hover */
+.hover-zoom-in .fl-photo-content {
+ overflow: hidden;
+}
+.hover-zoom-in .fl-photo-content .fl-photo-img {
+ -webkit-transition: 0.3s ease-in-out;
+ transition: 0.3s ease-in-out;
+ will-change: transform;
+}
+.hover-zoom-in .fl-photo-content .fl-photo-img:hover {
+ -webkit-transition: 0.3s ease-in-out;
+ transition: 0.3s ease-in-out;
+ -webkit-transform: scale(1.3);
+ transform: scale(1.3);
+}
+```
+
+#### Hover Zoom Out
+
+This effect adds a smooth zoom out effect when you hover over the image.
+
+```css
+/* Zoom out on hover*/
+.hover-zoom-out .fl-photo-content {
+ overflow: hidden;
+}
+.hover-zoom-out .fl-photo-content .fl-photo-img {
+ -webkit-transition: 0.3s ease-in-out;
+ transition: 0.3s ease-in-out;
+ -webkit-transform: scale(1.3);
+ transform: scale(1.3);
+ will-change: transform;
+}
+.hover-zoom-out .fl-photo-content .fl-photo-img:hover {
+ -webkit-transition: 0.3s ease-in-out;
+ transition: 0.3s ease-in-out;
+ -webkit-transform: scale(1);
+ transform: scale(1);
+}
+```
+
+#### Hover Zoom Out and Rotate
+
+This effect shows the image zoomed in and rotated 45 degrees in its default
+state and adds a smooth zoom out and rotates to upright when you hover over
+the image.
+
+```css
+/* Zoom out & rotate on hover */
+.hover-zoom-out-rotate .fl-photo-content {
+ overflow: hidden;
+}
+.hover-zoom-out-rotate .fl-photo-content .fl-photo-img {
+ -webkit-transform: rotate(15deg) scale(1.4);
+ transform: rotate(15deg) scale(1.4);
+ -webkit-transition: 0.3s ease-in-out;
+ transition: 0.3s ease-in-out;
+ will-change: transform;
+}
+.hover-zoom-out-rotate .fl-photo-content .fl-photo-img:hover {
+ -webkit-transform: rotate(0) scale(1);
+ transform: rotate(0) scale(1);
+}
+```
+
+#### Hover Unblur
+
+This effect displays the image in a blurred state and unblurs it on hover.
+
+```css
+/* Unblur on hover */
+.hover-unblur .fl-photo-content {
+ overflow: hidden;
+ -webkit-backface-visibility: hidden;
+}
+.hover-unblur .fl-photo-content .fl-photo-img {
+ -webkit-filter: blur(3px);
+ filter: blur(3px);
+ -webkit-transition: 0.3s ease-in-out;
+ transition: 0.3s ease-in-out;
+ will-change: filter;
+}
+.hover-unblur .fl-photo-content .fl-photo-img:hover {
+ -webkit-filter: blur(0);
+ filter: blur(0);
+}
+```
+
+#### Grayscale to Color
+
+This effect displays the image in grayscale and brings the color back on
+hover.
+
+```css
+/* Grayscale To Color */
+.gray-scale-img .fl-photo-content {
+ overflow: hidden;
+ -webkit-backface-visibility: hidden;
+}
+.gray-scale-img .fl-photo-content .fl-photo-img {
+ -webkit-filter: grayscale(100%);
+ filter: grayscale(100%);
+ -webkit-transition: 0.3s ease-in-out;
+ transition: 0.3s ease-in-out;
+ will-change: filter;
+}
+.gray-scale-img .fl-photo-content .fl-photo-img:hover {
+ -webkit-filter: grayscale(0);
+ filter: grayscale(0);
+}
+```
+
+#### Sepia to Color
+
+This effect displays the image in sepia tones and brings the color back on
+hover.
+
+```css
+/* Sepia To Color */
+.sepia-img .fl-photo-content {
+ overflow: hidden;
+ -webkit-backface-visibility: hidden;
+}
+.sepia-img .fl-photo-content .fl-photo-img {
+ -webkit-filter: sepia(100%);
+ filter: sepia(100%);
+ -webkit-transition: 0.3s ease-in-out;
+ transition: 0.3s ease-in-out;
+ will-change: filter;
+}
+.sepia-img .fl-photo-content .fl-photo-img:hover {
+ -webkit-filter: sepia(0);
+ filter: sepia(0);
+}
+```
diff --git a/beaver-builder/layouts/modules/tabs.mdx b/beaver-builder/layouts/modules/tabs.mdx
index efa0f5a2..dd4c964e 100644
--- a/beaver-builder/layouts/modules/tabs.mdx
+++ b/beaver-builder/layouts/modules/tabs.mdx
@@ -414,3 +414,64 @@ Typography settings control font family, size, weight, line height, letter spaci
The Advanced tab includes all the standard settings for margins, visibility, animations, and advanced HTML configurations.
See the [Advanced tab](../advanced-tab/index.md) section for more information.
+
+## Link to a Specific Item
+
+Learn how to create a link that navigates to a specific tab item.
+
+### Adding an `ID`
+
+To begin, first assign an `ID` to the Tab module, which can be accomplished by following the instructions below:
+
+1. Open the Tab module settings and click the [Advanced tab](../../advanced-tab/index.md).
+
+2. Scroll to the `ID` setting, and set a unique `ID` name for the module.
+ See the [Advanced tab](../../advanced-tab/html-element.md#id) article for more information about `ID` selectors.
+
+3. Save changes.
+
+### Index Values
+
+Every item in the Tab module is given a unique index value that starts at `0`. The index value of the initial Tab item is `0`, the second item is assigned an index value of `1`, the third item has an index value of `2`, and so on. By using these index values in an HTML link, you can generate a link to a specific Tab item and set it as the active item.
+
+The below HTML code example demonstrates how the index values are allocated to each Tab item. In this instance, the Tab module has been given a unique ID name of `my-tab` and consists of three Tab items.
+
+```html
+
+```
+
+### Link Structure
+
+The link structure will differ based on whether the Tab module is on the same page as your link. To create the link, you can use either the Button or HTML modules in your layout.
+
+#### Same Page
+
+When the link is on the same page as the Tab module, you can use a hash character (`#`) followed by an `ID` name and the item's index value separated by a hyphen. For instance, using our example `ID` name of `my-tab`, the link would be structured as follows:
+
+```html title='Button module link option'
+#my-tab-1
+```
+
+```html title='HTML module link'
+My Tab link
+```
+
+#### Different Page
+
+To create a link to the Tab module from a different page on your website, use the complete URL of the target page along with the hash symbol (`#`) followed by the `ID` and index value. For instance, if you want to add the link to your homepage, and the Tab module is located on a page named Sample Page, the link should appear like this:
+
+```html title='Button module link option'
+https://my-website.com/sample-page#my-tab-1
+```
+
+```html title='HTML module link'
+My Tab link
+```
diff --git a/beaver-builder/settings/advanced.md b/beaver-builder/settings/advanced.md
index 4856583f..f6912cf0 100644
--- a/beaver-builder/settings/advanced.md
+++ b/beaver-builder/settings/advanced.md
@@ -10,6 +10,8 @@ import TabItem from '@theme/TabItem';
The Advanced tab within Beaver Builder's settings provides options to enable or disable settings that typically require custom coding to achieve specific outcomes.
+
+
## Access Advanced
1. Access your site's WordPress Admin Dashboard.
diff --git a/beaver-builder/settings/blocks.md b/beaver-builder/settings/blocks.md
index b8752e3f..a48955f3 100644
--- a/beaver-builder/settings/blocks.md
+++ b/beaver-builder/settings/blocks.md
@@ -7,6 +7,8 @@ description: The Blocks tab in the Beaver Builder settings lets you control whic
The Blocks tab in the Beaver Builder settings allows you to enable module blocks. Module blocks are Beaver Builder modules developed as WordPress blocks for use in the WordPress block editor. These blocks maintain all the features and settings found in their module counterparts.
+
+
## What Module Blocks are available?
Beaver Builder module blocks are available for the following modules:
diff --git a/beaver-builder/settings/branding.md b/beaver-builder/settings/branding.md
index 924cb506..cfcfcc3b 100644
--- a/beaver-builder/settings/branding.md
+++ b/beaver-builder/settings/branding.md
@@ -7,6 +7,8 @@ description: The Branding tab in the Beaver Builder settings lets you white labe
The **Branding** tab in the Beaver Builder settings lets you white label the Beaver Builder plugin and BB Theme with your own brand and logo.
+
+
diff --git a/beaver-builder/settings/help-button.md b/beaver-builder/settings/help-button.md
index 367662b7..92d8ab40 100644
--- a/beaver-builder/settings/help-button.md
+++ b/beaver-builder/settings/help-button.md
@@ -7,6 +7,8 @@ description: The Help tab in the Beaver Builder settings lets you enable or disa
The **Help** tab in the Beaver Builder settings lets you enable or disable the Help button in the [Tools Menu](user-interface/tools-menu.md), or you can fine-tune which help options are available and add links to your own help services.
+
+
## Access Help Button
1. Access your site's WordPress Admin Dashboard.
diff --git a/beaver-builder/settings/icons.md b/beaver-builder/settings/icons.md
index e11365d0..c202fb04 100644
--- a/beaver-builder/settings/icons.md
+++ b/beaver-builder/settings/icons.md
@@ -7,6 +7,8 @@ description: The Icons tab in the Beaver Builder settings lets you enable, disab
The **Icons** tab in the Beaver Builder settings lets you enable, disable icon sets and upload custom icon sets which can be used in Beaver Builder modules.
+
+
## Access Icons tab
1. Access your site's WordPress Admin Dashboard.
diff --git a/beaver-builder/settings/import-export-settings.md b/beaver-builder/settings/import-export-settings.md
index cda49f87..a4a60d6f 100644
--- a/beaver-builder/settings/import-export-settings.md
+++ b/beaver-builder/settings/import-export-settings.md
@@ -7,6 +7,9 @@ description: The Advanced tab in the Beaver Builder settings is where you can en
The Import / Export tab in the Beaver Builder settings allow you to export, import, and reset Beaver Builder [global settings](user-interface/global-settings.md). By using this feature, you are able to easily configure Beaver Builder global settings for other websites you may be working on.
+
+
+
:::warning Warning
Exports completed with versions prior to **2.8.1** are not compatible with Beaver Builder version 2.8.1 or later, due to a change in format of export data.
diff --git a/beaver-builder/settings/license.md b/beaver-builder/settings/license.md
index e6ad4286..3d5457d9 100644
--- a/beaver-builder/settings/license.md
+++ b/beaver-builder/settings/license.md
@@ -7,6 +7,8 @@ description: The License tab in the Beaver Builder settings is where you enter y
The **License** tab in the Beaver Builder settings is where you enter your premium license key to unlock updates. This tab also lists which products are included in your license.
+
+
## Access License tab
1. Access your site's WordPress Admin Dashboard.
diff --git a/beaver-builder/settings/maintenance.md b/beaver-builder/settings/maintenance.md
index 5f0c93ec..cb6f3b2f 100644
--- a/beaver-builder/settings/maintenance.md
+++ b/beaver-builder/settings/maintenance.md
@@ -7,6 +7,8 @@ description: The Maintenance Mode tab in the Beaver Builder settings lets you co
The Maintenance Mode tab in the Beaver Builder settings lets you control when your site displays a temporary maintenance page to visitors.
+
+
## Usage
The Maintenance Mode page lets you put the front end of your site behind a single layout while you work on it. Visitors see the layout you choose, users with a bypass role see the normal site along with an admin bar indicator.
diff --git a/beaver-builder/settings/modules.md b/beaver-builder/settings/modules.md
index 12c1a1b1..addcebfa 100644
--- a/beaver-builder/settings/modules.md
+++ b/beaver-builder/settings/modules.md
@@ -7,6 +7,8 @@ description: The Modules tab in the Beaver Builder settings lets you control whi
The **Modules** tab in the Beaver Builder settings lets you control which modules will display in the [Content Panel](user-interface/content-panel.md) in the Beaver Builder editor. If there are some modules you never use, or some modules you don't want your clients to use, you can disable specific modules or even disable all modules.
+
+
## Access Modules tab
1. Access your site's WordPress Admin Dashboard.
diff --git a/beaver-builder/settings/post-types.md b/beaver-builder/settings/post-types.md
index fa256ac3..a65c55db 100644
--- a/beaver-builder/settings/post-types.md
+++ b/beaver-builder/settings/post-types.md
@@ -7,6 +7,8 @@ description: The Post Types tab in the Beaver Builder settings lets you control
The **Post Types** tab in the Beaver Builder settings lets you control which post types can use Beaver Builder.
+
+
## Access Post Types tab
1. Access your site's WordPress Admin Dashboard.
diff --git a/beaver-builder/settings/templates.md b/beaver-builder/settings/templates.md
index 99d488d3..f001e7d8 100644
--- a/beaver-builder/settings/templates.md
+++ b/beaver-builder/settings/templates.md
@@ -7,6 +7,8 @@ description: The Spacing section in the Advanced tab lets you change the default
The **Templates** tab in the Beaver Builder settings lets you manage which templates are available in the builder, choose from various enablement options, and, for Unlimited license holders, override core templates with your own.
+
+
## Access Templates tab
1. Access your site's WordPress Admin Dashboard.
diff --git a/beaver-builder/settings/tools.md b/beaver-builder/settings/tools.md
index acf432cd..29ed1fa4 100644
--- a/beaver-builder/settings/tools.md
+++ b/beaver-builder/settings/tools.md
@@ -7,6 +7,8 @@ description: The Tools tab provides a set of helpful controls, including options
The **Tools** tab provides a set of helpful controls, including clearing third party cache plugin caches, enabling debug mode, managing prerelease updates, sending usage data, and uninstalling Beaver Builder. These tools help you troubleshoot issues and maintain a smooth building experience.
+
+
## Access Tools tab
1. Access your site's WordPress Admin Dashboard.
diff --git a/beaver-builder/settings/user-access.md b/beaver-builder/settings/user-access.md
index 1c7fac97..6abe602a 100644
--- a/beaver-builder/settings/user-access.md
+++ b/beaver-builder/settings/user-access.md
@@ -7,6 +7,8 @@ description: The User Access tab in the Beaver Builder settings lets you limit w
The **User Access** tab in the Beaver Builder settings lets you limit which Beaver Builder features users can access.
+
+
## Access User Access tab
1. Access your site's WordPress Admin Dashboard.
diff --git a/beaver-builder/settings/version-control.md b/beaver-builder/settings/version-control.md
index d5f4eea0..b383a923 100644
--- a/beaver-builder/settings/version-control.md
+++ b/beaver-builder/settings/version-control.md
@@ -3,11 +3,12 @@ id: version-control
title: Version Control Tab
sidebar_label: Version Control
description: The Version Control tab allows you to quickly install any of the last 10 releases of Beaver Builder, Beaver Themer, or the Beaver Builder Theme (BB Theme).
-
---
The Version Control tab allows you to quickly install any of the last 10 releases of Beaver Builder, Beaver Themer, or the Beaver Builder Theme (BB Theme) without manually downloading files or using the WordPress plugin or theme installer.
+
+
## Enable Version Control
The Version Control tab is only available when [Beaver Builder Debug Mode](/beaver-builder/settings/tools.md#debug-mode) is **enabled**, so you must enable Debug Mode before you can access and use it. To access and use Version Control, you’ll need to first turn on Debug Mode.
diff --git a/beaver-builder/settings/welcome.md b/beaver-builder/settings/welcome.md
index 3f8d375a..6b3d0e54 100644
--- a/beaver-builder/settings/welcome.md
+++ b/beaver-builder/settings/welcome.md
@@ -7,6 +7,8 @@ description: The Welcome tab offers quick access to resources for getting starte
The Welcome tab offers quick access to resources for getting started with Beaver Builder. You can create a new page, see what’s new, and find links to support and community resources.
+
+
## Access the Welcome tab
1. Access your site's WordPress Admin Dashboard.
diff --git a/static/img/beaver-builder/settings--advanced--1.jpg b/static/img/beaver-builder/settings--advanced--1.jpg
index 1786cd2a..f78fb162 100644
Binary files a/static/img/beaver-builder/settings--advanced--1.jpg and b/static/img/beaver-builder/settings--advanced--1.jpg differ
diff --git a/static/img/beaver-builder/settings--blocks--1.jpg b/static/img/beaver-builder/settings--blocks--1.jpg
new file mode 100644
index 00000000..9aa25c20
Binary files /dev/null and b/static/img/beaver-builder/settings--blocks--1.jpg differ
diff --git a/static/img/beaver-builder/settings--branding--1.jpg b/static/img/beaver-builder/settings--branding--1.jpg
index 2306d703..1b9a3079 100644
Binary files a/static/img/beaver-builder/settings--branding--1.jpg and b/static/img/beaver-builder/settings--branding--1.jpg differ
diff --git a/static/img/beaver-builder/settings--help--1.jpg b/static/img/beaver-builder/settings--help--1.jpg
new file mode 100644
index 00000000..b96039fd
Binary files /dev/null and b/static/img/beaver-builder/settings--help--1.jpg differ
diff --git a/static/img/beaver-builder/settings--icons--1.jpg b/static/img/beaver-builder/settings--icons--1.jpg
index e2f47756..99d80979 100644
Binary files a/static/img/beaver-builder/settings--icons--1.jpg and b/static/img/beaver-builder/settings--icons--1.jpg differ
diff --git a/static/img/beaver-builder/settings--import--1.jpg b/static/img/beaver-builder/settings--import--1.jpg
new file mode 100644
index 00000000..524edbc2
Binary files /dev/null and b/static/img/beaver-builder/settings--import--1.jpg differ
diff --git a/static/img/beaver-builder/settings--license--1.jpg b/static/img/beaver-builder/settings--license--1.jpg
index cd2ddea5..721f5f1c 100644
Binary files a/static/img/beaver-builder/settings--license--1.jpg and b/static/img/beaver-builder/settings--license--1.jpg differ
diff --git a/static/img/beaver-builder/settings--maintenance--1.jpg b/static/img/beaver-builder/settings--maintenance--1.jpg
new file mode 100644
index 00000000..0c9c2f0a
Binary files /dev/null and b/static/img/beaver-builder/settings--maintenance--1.jpg differ
diff --git a/static/img/beaver-builder/settings--modules--1.jpg b/static/img/beaver-builder/settings--modules--1.jpg
index 80762d94..dae01d5d 100644
Binary files a/static/img/beaver-builder/settings--modules--1.jpg and b/static/img/beaver-builder/settings--modules--1.jpg differ
diff --git a/static/img/beaver-builder/settings--post-types--1.jpg b/static/img/beaver-builder/settings--post-types--1.jpg
index 1248e4f0..e1710526 100644
Binary files a/static/img/beaver-builder/settings--post-types--1.jpg and b/static/img/beaver-builder/settings--post-types--1.jpg differ
diff --git a/static/img/beaver-builder/settings--templates--1.jpg b/static/img/beaver-builder/settings--templates--1.jpg
index 20f6313b..7b14ae0d 100644
Binary files a/static/img/beaver-builder/settings--templates--1.jpg and b/static/img/beaver-builder/settings--templates--1.jpg differ
diff --git a/static/img/beaver-builder/settings--tools--1.jpg b/static/img/beaver-builder/settings--tools--1.jpg
index 253fee34..a3515cab 100644
Binary files a/static/img/beaver-builder/settings--tools--1.jpg and b/static/img/beaver-builder/settings--tools--1.jpg differ
diff --git a/static/img/beaver-builder/settings--user-access--1.jpg b/static/img/beaver-builder/settings--user-access--1.jpg
index 0a2cd3f0..753fba05 100644
Binary files a/static/img/beaver-builder/settings--user-access--1.jpg and b/static/img/beaver-builder/settings--user-access--1.jpg differ
diff --git a/static/img/beaver-builder/settings--version--1.jpg b/static/img/beaver-builder/settings--version--1.jpg
new file mode 100644
index 00000000..d603bff8
Binary files /dev/null and b/static/img/beaver-builder/settings--version--1.jpg differ
diff --git a/static/img/beaver-builder/settings--welcome--1.jpg b/static/img/beaver-builder/settings--welcome--1.jpg
index c691d3da..5aa516de 100644
Binary files a/static/img/beaver-builder/settings--welcome--1.jpg and b/static/img/beaver-builder/settings--welcome--1.jpg differ