Support

Account

Home Forums Front-end Issues Broken Design via shortcodes

Solving

Broken Design via shortcodes

  • I have an Avada site, which I wanted to add short codes to display my info. The editors will have ONLY access to the Option page section (via ACF). One simple design,

    <h2>[mytitle]</h2>
    <h1 style=”color:red; margin:15px, width:200px”>[my_fptitle]</h1>

    BUT when saved, the h1 is totally alone, and the shortcode is displayed outside. See screenshots. See Screenshot 1

    The second screenshot, I made a simple design, but the shotcode does not show inside the design also.

    Any help will be appreciated,Broken Shortcode DesignShortcode design BROKEN

  • Without the code being used for the shortcode there is no way of saying.

  • Good point, here is the code to create the short code, the way we have it is that we made the option page, and from there editors will add the text. With the short code we will place it on the design website (this is about us), with its design, on the text editor (in this case (fusion builder), then theoretically it will display the text with the new look on the about us page. Right now, the text shows up on top of the content, and the design of it under it (without, ignoring any relation).

    https://gesher.creativewebdesign123.com/about/

    // About us
    
    function my_tabout_shortcode() { 
        $tabout = get_field('tabout', 'option');?>
    <div class="tabout" id="tabout"><span> <?php echo $tabout; ?> </span></div>
    
    <?php
    }
    add_shortcode( 'my_tabout', 'my_tabout_shortcode' );

    See for example,

    <h2>[mytitle]</h2>
    <h1 style=”color:red; margin:15px, width:200px”>[my_fptitle]</h1>

  • Thank you for your time helping me.

  • You are outputting the shortcode when it is run. What you have to do is return the output that it generates

    
    ob_start();
    
    // output
    
    return ob_get_clean();
    
  • Like this?

    // About us
    ob_start();
    function my_tabout_shortcode() { 
        $tabout = get_field('tabout', 'option');?>
    <div class="tabout" id="tabout"><span> <?php echo $tabout; ?> </span></div>
    
    <?php
    }
    add_shortcode( 'my_tabout', 'my_tabout_shortcode' );
    return ob_get_clean();
    
  • 
    
    function my_tabout_shortcode() { 
        ob_start();
        $tabout = get_field('tabout', 'option');?>
    <div class="tabout" id="tabout"><span> <?php echo $tabout; ?> </span></div>
    
    <?php
        return ob_get_clean();
    
    }
    add_shortcode( 'my_tabout', 'my_tabout_shortcode' );
    
  • Hi brother, thank you for your patience, see this simple code:

    `<h1 style=”color: red; margin: 22px, width:200px;”>[my_fptitle] 24</h1>

    Is on the about page, https://gesher.creativewebdesign123.com/about/

    Title “An amazing title 66” is one place and the 24 is decorated somewhere else.

    I did implement what you said there,

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.