Incorrect Shortcodes with Divi Builder

This topic contains 38 replies, has 6 voices, and was last updated by  Alex Rollin 6 years, 4 months ago.

We have moved to a support ticketing system and our forums are now closed.

Open Support Ticket

Tagged: ,

  • Author
    Posts
  • December 1, 2017 at 4:10 pm #407789

    balifornia
    Expired Member
    Post count: 31

    Hello dear support team,

    we are currently developing a directory with your Supreme theme that is really great! We combine the theme with the Divi Builder with which we have already realized some pages and gained very good experiences.
    But now we have the problem that the shortcodes of Geodirectory are not displayed correctly in conjunction with the Divi Builder.
    Specifically, this is the home page where these issues occurred. Elsewhere, we have not tried it yet.

    Could it possibly be that you take a look at this?

    Many Thanks!

    December 1, 2017 at 4:15 pm #407791

    balifornia
    Expired Member
    Post count: 31
    This reply has been marked as private.
    December 1, 2017 at 4:19 pm #407792

    balifornia
    Expired Member
    Post count: 31

    Here are the pictures again a little smaller

    December 1, 2017 at 7:02 pm #407823

    Alex Rollin
    Moderator
    Post count: 27815

    Hello!

    Which page URL and what shortcode?

    We can take a look at it and give you some advice.

    December 1, 2017 at 7:06 pm #407824

    balifornia
    Expired Member
    Post count: 31

    I sent you the access data in a private post below. You can not see it?

    December 1, 2017 at 7:49 pm #407835

    Alex Rollin
    Moderator
    Post count: 27815

    Hello!

    No, I do not see anything that looks like the issue you are describing.

    Can you tell us where we can see the issue you are describing, or the steps we take to reproduce the issue?

    December 1, 2017 at 7:58 pm #407839

    balifornia
    Expired Member
    Post count: 31

    Just start the Divi Builder on the home page. Then the shortcode is moved to the editor by the builder. If you click save then you will see the change immediately.

    December 1, 2017 at 8:09 pm #407842

    Alex Rollin
    Moderator
    Post count: 27815

    Hello!

    The shortcode appears to render fine on the frontend.

    What is the problem?

    December 1, 2017 at 8:12 pm #407843

    balifornia
    Expired Member
    Post count: 31

    That we are not able to use the shortcodes with the Divi Builder. If we do, it looks like this. Please visit the site again.

    December 1, 2017 at 8:44 pm #407846

    Alex Rollin
    Moderator
    Post count: 27815

    Hello!

    I see! So, this is a case where the builder incline classes are overriding GD.

    We have created a screencast that shows you how to create custom classes that will help keep GD’s classes a priority:

    https://screencast-o-matic.com/watch/cbeiig6UKA

    That comes from here: https://wpgeodirectory.com/support/topic/list-heading-size-in-page-builder/

    You can also review Divi’s information here, so you can learn how to use it:
    https://www.elegantthemes.com/blog/resources/exploring-divi-2-4-using-the-divi-code-module-to-integrate-third-party-plugins-in-the-builder

    Basically what that says is to include the shortcode in a module (full width).

    December 1, 2017 at 9:12 pm #407851

    balifornia
    Expired Member
    Post count: 31

    Okay, I have now moved the code to the full width module. Can you please tell me what needs to be done to get exactly the look I have when working without the Divi Builder? Creating a class is not a problem, but what do I have to define to get everything in the unchanged GD Style?

    December 1, 2017 at 9:41 pm #407858

    Alex Rollin
    Moderator
    Post count: 27815

    Hello!

    Divi has options that should allow you to put in shortcodes without altering the output.

    https://www.elegantthemes.com/blog/resources/exploring-divi-2-4-using-the-divi-code-module-to-integrate-third-party-plugins-in-the-builder

    https://www.elegantthemes.com/documentation/divi/code/

    December 1, 2017 at 11:49 pm #407871

    balifornia
    Expired Member
    Post count: 31

    You can not offer me a solution as I can see the simple shortcode of the plugin without errors? I do not want a complicated solution or anything else. Divi Builder is compatible with the wpgeodirectory settings. Instead, I have not been able to place a simple shortcode for hours. It would be nice if you had a solution and not send me any links that contain only solutions that do not work. Thank you in advance! 🙂

    December 2, 2017 at 3:19 am #407894

    Jonathan
    Lifetime Member
    Post count: 79

    Hello Balifornia:

    I happen to use Divi myself and our designer does most of the design aspect for our project but I decided to try and post a simple shortcode to our homepage to see if I could make it work.

    Shortcode used: [gd_homepage_map width=100% height=300 scrollwheel=false] (first example found on https://wpgeodirectory.com/docs/core-shortcodes/ and it happen to be a homepage code).

    Steps:

    1. Went to list of Pages
    2. Selected by Home Page
    3. Selected Edit with Visual Builders
    4. Added a full width row with module type Code.
    5. In the content section I put the example shortcode: [gd_homepage_map width=100% height=300 scrollwheel=false]
    6. I selected the Check icon with green background to save and it the section to my homepage.

    I have never used shortcodes in Divi. We barely just integrated Divi within about 45 days. It was pretty seamless to me. Am I missing a step?

    Hope this helps or at least you can reply with the step where I may have misunderstood your needs.

    Warm Regards,

    Jonathan

    December 2, 2017 at 8:42 am #407913

    Guust
    Moderator
    Post count: 29970

    The issue is that the Divi Builder wraps its own code around the GD shortcodes or anything else you add to the page.
    For example adding Hi to the page results in this code.

    <p>Hi</p>

    Just enabled the Divi Builder without anything else changes the code to 

    

    <div class="et_builder_outer_content" id="et_builder_outer_content">
<div class="et_builder_inner_content et_pb_gutters3">
<div class="et_pb_section  et_pb_section_0 et_section_regular et_section_transparent">
<div class=" et_pb_row et_pb_row_0">
<div class="et_pb_column et_pb_column_4_4  et_pb_column_0 et-last-child">
<div class="et_pb_text et_pb_module et_pb_bg_layout_light et_pb_text_align_left  et_pb_text_0">
<div class="et_pb_text_inner">
<p>Hi</p>
</div>
</div>
</div>
</div>
</div>
    

    So all these extra style classes that are added by Divi Builder break the styling code of anything inside and will need adjusting. Maybe the Divi Builder developers have an easy solution.
    

		
	
    


    

			
		
	
    • 

	
  • 

		
    Author
    

		
    

			
				Posts
			
		
    

	
    • 





			



	


		Viewing 15 posts - 1 through 15 (of 39 total)
	


	


		

	

	





		
				

			

				

					
We have moved to a support ticketing system and our forums are now closed.

					Open Support Ticket