-
Posts
-
Hi,
I added a headline rotator in my secondary menu, adding this code in WP / Enfold Child Theme Options / Header / Add Extra Info in Header (top left) :
[av_headline_rotator before_rotating='' after_rotating='' margin='' margin_sync='true' align='left' custom_title='' size='' av-medium-font-size-title='' av-small-font-size-title='' av-mini-font-size-title='' tag='h3' interval='5' animation='fade' alb_description='' id='' custom_class='slogan-rotatif-menu-secondaire' av_uid='av-k651payb' admin_preview_bg=''] [av_rotator_item title='<a href=‘’ title=’‘ class=’’ data-av_icon="" data-av_iconfont="awesome-font" title=""></a> Paiement sécurisé' custom_title='' link='' linktarget='' av_uid='av-lncu6'] [av_rotator_item title='<a href=‘’ title=’‘ class=’’ data-av_icon="" data-av_iconfont="awesome-font" title=""></a> Livraison offerte à partir de 50€' custom_title='' link='' linktarget='' av_uid='av-e8icu'] [av_rotator_item title='<a href=‘’ title=’‘ class=’’ data-av_icon="" data-av_iconfont="awesome-font" title=""></a> Expédition sous 48h' custom_title='' link='' linktarget='' av_uid='av-7pqyu'] [/av_headline_rotator]Unfortunately, there is a big display issue and I don’t know how to fix it.
Indeed, when the page is loaded the 3 texts appear at the same time, then one disappear and 2 are still shown, then 1 and after that only, it seems to work correctly. But if I only go to another page tab and I come back to this page, display in not good anymore… and so on…Could you help me please?
Thanks a lot!
Hey fcp,
Could you please give us a link to your website, we need more context to be able to help you.
Best regards,
VictoriaHi,
Sorry for the late reply, I took a look at your headline rotator in your topbar, but it looks link it is working correctly to me, were you able to correct this already?Best regards,
MikeHi Mike,
I’m sorry but the headline rotator has not been corrected and the display issue still appears.
I made some Imgur screenshots to be clearer.
So, when the page is loaded for the first time :
1) First appear the 3 texts like this : https://imgur.com/T4XcysZ
2) Then it fades to those 2 texts : https://imgur.com/shuFmQ3
3) And after this, only 1 text is displayed : https://imgur.com/QeZOXzw
After that, everything seems to work correctly but what do I need to do to correct this issue?
Thanks a lot!Hi,
Thanks for the screenshots, I found that there were some curly quotes in your shortcode so I corrected and the initial display css was not taking effect when it is in the phone info box, so I added this to your Quick CSS:/*Headline Rotator in phone-info*/ .phone-info .av-rotator-text-single { display: none; }It now seems to be working correctly, please clear your browser cache and check.
Best regards,
MikeHi Mike,
Thanks a lot for your help!
Could you please tell me what you modified in my shortcode?I’m using two different browsers : Chrome and Safari.
I cleared cache on both of them and the problem seems to be solved on Chrome.But the issue is not completely solved on Safari. Indeed, display on page first load seems to be ok now, but when I open another tab and come back to my website tab later, something really weird happens: texts appear anywhere, like you can see on those screenshots.
Could you please help?
Thanks a lot!
Hi,
The only thing I changed in your code was the curly quotes, if you look in your original post you will also see them:<a href=‘’ title=’‘ class=’’
What I found was that on page load this is the css applied to the Headline Rotator:.av-rotator-text-single { display: none; }then the javascript kicks in and changes the display for each rotation.
I tested your page on my Mac with Safari and the Headline Rotator seemed to act the same for me, Please see the screencast in Private Content area.
Perhaps your Safari is still caching?Best regards,
MikeHi,
To show you the issue on my side, I made a video too. You can find it in Private Content.
As you can see, I clear caches, I reload the page, I clear caches one more time and then, I only open some new tabs…
When I come back to my home page tab, display is not good at all. Sometimes this is like this, but some other times, it could be only one of the three texts which appears more on the right. This is kind of crazy…
What could cause this?
Thanks a lot !Hi,
Thank you for the video it helps show what you are seeing, but I don’t see this on Safari. Does your site use any content delivery networks (CDN)? If so I could be seeing a different set of files because I’m in a different part of the world.
You could ask your webhost to clear any server cache and CDN, which could take 24 hrs, and then clear your cache and history again and check.Best regards,
MikeHi Mike,
Ok, I think I gonna put this issue aside for the moment and I will test it later with another computer and on another networks.
Thanks a lot for your help! :-)Hi Mike,
I’m trying to increase the padding between icons and texts on my headline rotator in secondary menu.
I tried to attribute a custom class to it and then add this css:
.slogan-rotatif-menu-secondaire .av-icon-char {padding-right: 4px!important;}
but it doesn’t work.
Do you know what I could do to achieve this?
Thanks a lot!Hi,
Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:.phone-info .av-rotator-text-single > a { padding-right: 10px; }please adjust to suit, then clear your browser cache and any cache plugin, and check.
Best regards,
Mike
- The topic ‘Headline rotator with icons in secondary menu’ is closed to new replies.