WordPress.org

Ready to get started?Download WordPress

Forums

IG PageBuilder
[resolved] Issues with Templates & Tabs Formatting (getting lost) (15 posts)

  1. pinkstudios
    Member
    Posted 2 months ago #

    Hi,
    I am having major issues with this app (version 2.2.1).

    Chen i click on "Save As Template", name it and then click on "Load Template" - it's not display my saved template.

    Also, I am trying to create a layout using Tabs and Accordions; when i start settingup the tabs they work wonders and look amazing. However, after a few edits, it just discards my formatting and drops everything on a single paragraph whether there were bullets or anything.

    Any help would be appreciated help! :)

    https://wordpress.org/plugins/ig-pagebuilder/

  2. khoinguyenbb
    Member
    Posted 2 months ago #

    Hi,

    Thank you for using IG PageBuilder!

    We are checking problems of template function and will reply shortly.

    About using Tabs and Accordions, would you mind showing me the url/your website which has the problem?

  3. pinkstudios
    Member
    Posted 2 months ago #

    Hi,

    Thanks for responding. The page where i was trying it was:

    http://nuco.dev.edukgroup.net/grados-y-programas/area-de-estudios/justicia-criminal-y-seguridad/

    Looking fwd to reading from you! ;)

  4. khoinguyenbb
    Member
    Posted 2 months ago #

    Hi,

    Thanks pinkstudios,

    We are investigating the problem and will fix it soon. Please stay tuned.

  5. khoinguyenbb
    Member
    Posted 2 months ago #

    Hi pinkstudios,

    About using Tabs and Accordions, a long title and/or too many items could cause the problem you had. I think you should shorten a title and reduce number of items in those elements.

    Our team are working on template issue. Could you please tell me which version of WordPress, which browser and its verion you are using?

    Look forward to hearing feedback from you!

  6. InnoGears
    Member
    Plugin Author

    Posted 2 months ago #

    Hi pinkstudios, about the tab's style, I made a quick investigation and realized that, the tab's style was altered by a rule in your wp-content/themes/parallelus-moxie/style.css, line 249:

    li {
        margin: 0 0 0 36px;
    }

    ... so the margin for each tab is too high, you can fix this by under tricks:

    1. Adding following CSS code into the end of your theme's CSS file (wp-content/themes/parallelus-moxie/style.css) :

    .jsn-bootstrap3 .nav-tabs li {
        margin-left: 0 !important;
    }

    2. Or you can use "Custom CSS" feature of IG PageBuilder:
    - Edit you post
    - Switch to Page Builder tab if it's not
    - Click on "Custom CSS" button
    - Add following code to "CSS Code" text box:

    .jsn-bootstrap3 .nav-tabs li {
        margin-left: 0 !important;
    }

    - Save it then reload your frontend page

  7. pinkstudios
    Member
    Posted 2 months ago #

    Hi, khoinguyenbb!

    We're using WP version 3.9 and have used both browsers Mozilla & Chrome.

    I have made the sidebar smaller to my tabs would fit.

    How about the templates not saving and the formatting of the content getting lost after a few edits?

  8. sangbui
    Member
    Posted 2 months ago #

    Hi pinkstudios,

    Please test with IG Page Builder 2.2.1 and Firefox 28.0, there are some same issue was fixed with this update and browser, let me know if the issue still happened.

    Thanks,
    InnoGears Support Team.

  9. mandlaness
    Member
    Posted 2 months ago #

    I have decided to use IG Pagebuilder on my new website and I would like to edit the layout of the Tabbed area content so that it has 4 colunms within each tab. Col 1=Image, Col 2=Formated text, Col 3=Formated text and Col 4=Formated text.

    Can you please point me to the right direction?

  10. sangbui
    Member
    Posted 2 months ago #

    Hi mandlaness,

    Thank you for contacting us, We are checking your question and will reply back soon for you with a solution.

    Support Team.

  11. Adam
    Member
    Posted 2 months ago #

    Hi mandlaness,

    This task is a bit complicated but in general, you can combine shortcode with manual code to get your desire result.

    1. Please create a new page, added 4 columns with appropriate elements as described above (image/text/text/text)

    2. As you might know, each element has its own shortcode so you will have to get it first. Choose edit (the edit icon stays on the top right) image element >>> switch to tab Shortcode >>> choose copy to clipboard >>> paste this to to a text file. Repeat this process with 3 other elements so you will have 4 shortcodes in your text file.

    3. Save this page and set it as published. Please make sure that you don't remove this page as it's needed to generate content to present in your tab.

    4. Create another page, add Tab element there then choose Edit >>> choose tab 1 then hit Edit button >>> in WYSIWYG editor, hit the Source button (it looks like this <>) and paste these declarations :

    <div style="padding-top:10px;padding-bottom:10px;padding-left:10px;padding-right:10px;" class="row ">
    	<div class="col-md-3 col-sm-4">
    		[shortcode 1]
    	</div>
    	<div class="col-md-3 col-sm-4">
    		[shortcode 2]
    	</div>
    	<div class="col-md-3 col-sm-4">
    		[shortcode 3]
    	</div>
    	<div class="col-md-3 col-sm-4">
    		[shortcode 4]
    	</div>
    </div>

    Replace above [shortcode 1] with shortcode of image element, the same goes for 2, 3 and 4. After that, choose Save in 2 next screens then hit Update to publish your page and recheck your result.

    *** NOTE ***

    Since this is only a workaround, sometimes it might display incorrectly in the front-end as you can see 4 columns with shortcodes only. To fix this problem, go to Tab element in back-end >>> hit Edit button >>> switch to Styling tab >>> then if you see the image with 3 text columns >>> choose Save and Update the page again.

  12. mandlaness
    Member
    Posted 2 months ago #

    I will try this and let you know.

    Thank you so much for taking time to analyse my issue and replying.

  13. Adam
    Member
    Posted 2 months ago #

    Hi mandlaness,

    We haven't heard anything from you for 2 days, could you please confirm your status ?

    In case you need further assistant, please feel free to let me know.

    Best regards,

    Adam.

  14. mandlaness
    Member
    Posted 2 months ago #

    Hi Adam,

    Although your solution would have worked, I had to go with wp-bootstrap-tabs as it was quicker to implement.

    I am certainly going to try out your plugin in the future.

    Thank you for your assistance.

    Regards,
    Mandlaness

  15. Adam
    Member
    Posted 2 months ago #

    Hi,

    Glad to hear that your problem has been solved.

    If you still have any question or need further assistant, don't hesitate to let us know.

    Best regards,

    Adam.

Reply

You must log in to post.

About this Plugin

About this Topic