Hiding Avia section for the output

[ip2C]

A so necessary feature all other Templatebuilder have is hiding a pr build section. Actually I use the class hide for this.

But: In the Backend in the themeeditor

In this bar there should be a eye sign, to hide that section to be outputted - what Do you think?

[ip2C]

Step 1: Create the Add-on Structure

You can create a custom plugin or use the child theme's functions.php file. For a plugin, the structure might look like this:

css

/wp-content/plugins/enfold-hide-section/ |-- enfold-hide-section.php

In enfold-hide-section.php, you'll start with the following code:

php

<?php /**

• Plugin Name: Enfold Hide Section Addon
• Description: Adds a feature to hide sections in the frontend while keeping them visible in the backend.
• Version: 1.0
• Author: Your Name */

if ( ! defined( 'ABSPATH' ) ) { exit; // Exit if accessed directly. }

// Include the core functionality include_once('hide-section-functionality.php');

Step 2: Implement the Core Functionality

In the hide-section-functionality.php file (or directly in your functions.php file if you're not creating a plugin), add the following code to add the hide functionality:

php

<?php

// Add the custom shortcode attribute to hide sections on the frontend add_filter('avf_shortcode_options', 'add_hide_section_option', 10, 1);

function add_hide_section_option($elements) { foreach ($elements as &$element) { if ($element['shortcode'] == 'av_section') { $element['subelements'][] = array( 'type' => 'checkbox', 'name' => __('Hide Section on Frontend', 'avia_framework'), 'desc' => __('Check to hide this section on the frontend', 'avia_framework'), 'id' => 'hide_on_frontend', 'std' => '', 'container_class' => 'avia-element-fullwidth', ); } } return $elements; }

// Modify the output of the section shortcode based on the new attribute add_filter('shortcode_atts_av_section', 'hide_section_frontend', 10, 3);

function hide_section_frontend($atts, $content, $shortcodename) { if (!empty($atts['hide_on_frontend']) && $atts['hide_on_frontend'] == 'yes') { if (!is_admin()) { return ''; // Hide the section on the frontend } } return $atts; }

Step 3: Add the CSS for Backend Indication (Optional)

To visually indicate that a section is hidden on the frontend, you can add some CSS to the WordPress admin area:

php

add_action('admin_enqueue_scripts', 'enfold_hide_section_admin_css');

function enfold_hide_section_admin_css() { echo ''; }

To ensure the CSS applies to the elements based on whether the "Hide Section on Frontend" checkbox is selected, you'd need to add a small JavaScript snippet to dynamically update the title in the Avia Builder:

php

add_action('admin_footer', 'enfold_hide_section_admin_js');

function enfold_hide_section_admin_js() { ?>

<?php

}

Step 4: Test and Adjust