Tab Section Terminates Main - Support | Kriesi.at

Tagged: tab section

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

Author

Posts
May 4, 2017 at 3:18 pm #787852
boethius
Participant
Hi,

thank you for a great theme and awesome work!

I’ve encountered a mysterious termination of the main content container element.

Please have a look at Ref1. After the tab section, the whole content breaks in responsive mode. Looking at the source, there are a bunch of extra </div> elements:
```
    </div> 
    </div>
    
    </div>
    </div>
```
Ref2 displays this correctly. I cannot figure out what causes this. It goes away when I remove the tab section. At first I thought it was something to do with a Code Block maybe having an extra div, but then the comment  would appear somewhere too which means it must be generated.

Thanks for having a look!
May 4, 2017 at 8:14 pm #788035

Victoria
Inactive Moderator

Hey Sebastian,

Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look.

Best regards,
Victoria

May 5, 2017 at 10:27 am #788292

boethius
Participant

I’ve given you access to the test site where problem also occurs.

May 7, 2017 at 6:15 pm #789126

Victoria
Inactive Moderator

Hi boethius,

Could you please post us a few screen shots of the problem? The looks, not the html, I’ve checked html, looks fine. The menu that stays at the middle of the page and all the notices, they really make it difficult to investigate.

Best regards,
Victoria

May 8, 2017 at 1:08 pm #789532

boethius
Participant

Please see the attached screenshot. I’ve also turned off notices now, let me know if you need them on again for debugging.

May 8, 2017 at 1:52 pm #789576
Victoria
Inactive Moderator
Hi boethius,

As you can see on the screenshots in private, it looks ok now. I would make the icons smaller though.
```
@media only screen and (max-width: 350px) {
    .av-catalogue-image {
      width: 40px;
      margin-right: 20px;
    }
```
Best regards,
Victoria
May 9, 2017 at 10:56 am #790124
boethius
Participant
Hi Victoria

Thank you, but this problem is not occurring on the other languages on the site, even though the same tab section is used. So a CSS patch won’t help in this case. Also, if you look at the other languages it doesn’t even come close to fixing it. Again, if you look at the source code, and analyze it using an HTML validator, you will see that there are two extra </div> terminating tags right after the tab section. If you remove the tab section, you don’t need CSS patches.
- This reply was modified 7 years, 7 months ago by boethius.
May 9, 2017 at 12:56 pm #790219
grizzlydev
Participant
Hi, sorry to step in, but : I encounter the exact same behavior with any section elements, be it color-section, grid-line, tab-section.
I believe the problem is located near the top of the “avia_new_section” function (config-templatebuilder/avia-shortcodes/section.php). The way the variable $close is set.

Edit: I think I got it to work. The trick is that if there’s at least one section element in the page, everything else has to be encapsulated inside section elements.
- This reply was modified 7 years, 7 months ago by grizzlydev.
May 9, 2017 at 2:54 pm #790312

Victoria
Inactive Moderator

Hi boethius,

Which plugin are you using for translations and which is the original language of the page?
I was not able to reproduce the way it looks on your original screenshot.

Best regards,
Victoria

May 9, 2017 at 2:55 pm #790314

Victoria
Inactive Moderator

Hi grizzlydev,

Please start a separate thread to avoid confusion. There, please describe your issue and give us a link to your website.

Best regards,
Victoria

May 9, 2017 at 3:57 pm #790401

boethius
Participant

Hi again @Victoria

I looked at @grizzlydev’s suggestion as well, and it appears to be in the parameters that are being sent to the avia_new_sections function, where $close is being set to true for some reason.

I’m using WPML to translate. The original language is english.

Steps to reproduce:
1. Edit the front page in German
2. Remove the tab section
3. Publish
– Notice how the content below is now showing correctly and there are no extra </div> tags
4. Edit same front page
5. Add a tab section with content in the same place as before
6. Publish
– The </div> tags are back, even though the content is different.

Thank you for replying.

Kind regards,
Sebastian

May 9, 2017 at 9:04 pm #790590

Basilis
Inactive Moderator

Hi,

Please contact WPML team and they will be able to provide the informations required.
They will also point out if the issue is on our side and they will be able to point us the problem and Kriesi will apply any fixes, if so.

Best regards,
Basilis

May 9, 2017 at 9:44 pm #790621

boethius
Participant

@Basilis, I’ve contacted the WPML team: https://wpml.org/forums/topic/strange-behavior-in-theme-enfold-tab-sections/. I will post updates here if there are relevant findings to Enfold.

May 9, 2017 at 10:03 pm #790641

Basilis
Inactive Moderator

Hi,

We appreciate for keeping us updated.
Thank u

Best regards,
Basilis

May 15, 2017 at 12:11 pm #793268

boethius
Participant

@basilis,@victoria, @grizzlydev

An update: The issue is reproducible if you set any tabbed page in german to the default home page. If you unset it as homepage, the tabs work properly again.

Let me know if you need assistance reproducing this!

May 16, 2017 at 7:21 pm #794343

Basilis
Inactive Moderator

Hi,

There is a simillar issue to that, that Kriesi is already trying to identify,
We do appreciate your patience a lot!

Best regards,
Basilis

June 21, 2017 at 11:16 am #810897

boethius
Participant

Hi!

I wanted to update that this is still an issue. We have figured out a workaround, and a way to reproduce the issue. It’s extremely labor-intensive to even update the page as every time we add something, it breaks. We would really appreciate some effort in resolving this soon.

Workaround Steps (try this with http://stage.paymash.com/de/)
1. Save entire page as template
2. Delete the page entierely
3. Create new page and reapply template
4. (For homepage, re-add as front page and apply translations)

Reproduce
1. Open Front Page in German
2. Add any element
3. Publish

Kind regards

June 25, 2017 at 7:54 pm #812791

Basilis
Inactive Moderator

Hi,

Thank you for the clear explanation.
I am forwarding exactly like that to our developers.

Best regards,
Basilis

June 27, 2017 at 4:07 pm #813500

boethius
Participant

Hi @basilis

Any update as to where you are with this? This is a really cumbersome way to use Enfold otherwise.

Thanks for quick update!

Kind regards,

Sebastian

June 29, 2017 at 5:57 am #814228
Ismael
Moderator
Hi,

Thank you for the update. We are aware of the issue and it is under investigation. One solution is to move all elements or set of elements inside their own color section. Or try to modify the enfold > config-templatebuilder > avia-template-builder > php > template-builder.class.php file, look for this code around line 515.
```
$_POST['content'] = ShortcodeHelper::clean_up_shortcode($_POST['content']);
```
.. replace it with:
```
if( ! empty( $_POST['_aviaLayoutBuilderCleanData'] ) )
 					{
 						$_POST['content'] = ShortcodeHelper::clean_up_shortcode( $_POST['_aviaLayoutBuilderCleanData'] );
 					}
 					else
 					{
 						$_POST['content'] = ShortcodeHelper::clean_up_shortcode( $_POST['content'] );
 					}
```
Edit the page again, toggle a few options or add another element then update.

Best regards,
Ismael
August 9, 2017 at 5:06 pm #836501

boethius
Participant

Hi @ismael

This is still occuring. I’ve made a video to further illustrate the extra </div> tags that are being injected:

https://www.dropbox.com/s/ne5w5hgyh6k4i1k/TabBarBug.mov?dl=0

Best regards,

Sebastian

August 15, 2017 at 9:15 am #839119

Ismael
Moderator

Hi,

Thank you for the update.

Did you modify the file as previously suggested? Or try the following script.

// https://kriesi.at/support/topic/grid-rows-arent-responsive/#post-756803

Best regards,
Ismael

August 15, 2017 at 9:25 am #839126

boethius
Participant

Hi @Ismael

Thank you for your reply.

I will try the above java-script as it essentially does what I do in the video, but that can’t be the actual solution, to go and reorder the elements past render?

A modification is already in place, but that’s the code you pushed in 4.1.2 with isset instead of your suggested !empty above?

Best regards,

Sebastian

August 16, 2017 at 7:01 am #839721

Ismael
Moderator

Hi,

that can’t be the actual solution, to go and reorder the elements past render?

Yes, that’s a temporary solution until we find a final patch for the issue. Unfortunately, the issue is quite random and we can’t figure out what’s causing it.

Best regards,
Ismael

August 21, 2017 at 5:21 pm #842109

boethius
Participant

Hi @ismael

We did this JS workaround, you also need to add .container_wrap.footer_color to the children.

But, this is not a solution. There is an example on the German staging page, and the source in private.

August 22, 2017 at 8:18 am #842357

Ismael
Moderator

Hi,

But, this is not a solution. There is an example on the German staging page, and the source in private.

Did the script work? Like I said, the issue is quite random and it rarely happens on an installation so we can’t find what’s causing it. The patch on (#post-814228) has been included in the upcoming version of the theme but if it’s not working, try to re-create the page from scratch then translate it again.

// https://kriesi.at/support/topic/tab-section-terminates-main/#post-814228

Best regards,
Ismael

August 22, 2017 at 8:29 am #842363

boethius
Participant

Hi @ismael

Thanks for the reply. As I said, the JS script fixed the issue, but it was incomplete as it didn’t add all the containers. I amended it.

We’ve recreated the page several times from scratch, and the issue kept reoccurring. So if you mean there should be a fix in the _new_ version of Enfold that has not been released yet? Then we can make another attempt, if it generates different short codes. Again, the problem isn’t just on this page, we have no idea where else it could be occurring, and it’s a bigger site potentially affecting multiple pages.

I uploaded the source to the post where this is occurring. Can you please check it to see if there are old shortcodes in it that would cause this issue. If not, then why would we rebuild the page and expect a different result every time?

Best regards,

Sebastian

August 23, 2017 at 7:23 am #842885

Ismael
Moderator

Hi,

The markup of that page looks correct. The sections, footer and socket are inside the main container as expected. I didn’t find the script either. Are you sure that this is the page with the issue? ( see private field )

Best regards,
Ismael
Author

Posts

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

You must be logged in to reply to this topic.