-
Search Results
-
In reply to: Translation of 'share this entry' not showing
Hi Mike,
I see that the code is’nt working correctly on mobile. Also I’ve changed something to the social icons which are perfect on desktop but not on mobile. When I change on mobile nothing happens. Any ideas? This is the code I have:
.av-share-link-description.av-no-toc { text-align: center !important; } .av-share-box .avia-related-tooltip { display: none !important; } #top .av-share-box ul { margin: auto !important; width: 15%; float: none !important; } @media only screen and (max-width 767px) { #top .av-share-box ul { margin: auto !important; width: 35% !important; float: none !important; } } .av-share-box ul li a { font-size: 18px !important; } .av-share-box ul li, #top .av-share-box ul { border: none !important; } h5.av-share-link-description.av-no-toc:before { content: 'Share this story'; color: #333333; } h5.av-share-link-description.av-no-toc { color: #ffffff; width: 109%; }In reply to: Icon tooltip width
Hey Misko,
Try adding this CSS code in Quick CSS, located in Enfold > General Styling:
#top .avia-icon-tooltip { width: auto !important; max-width: 250px; }Hope it helps.
Best regards,
NikkoTopic: Icon tooltip width
Hi, how can I get the rollover icon tooltip to follow the actual amount of text, rather than that it is in some predefined default width?
I would like it to be as large as it is necessary, not larger, or in other words, that it is defined through padding and margin in relevance to the text.
Please see the picture: in the first raw you can see the default behaviour. In the second raw you see roughly what I would like to achieve.
Thank you!
Hi,
In the av-share-box only the Email button is displayed correctly. All other buttons remain empty. Email:
<a aria-label="Per E-Mail teilen" href="mailto:?subject=xxx" aria-hidden="false" data-av_icon="" data-av_iconfont="entypo-fontello" title="" data-avia-related-tooltip="Per E-Mail teilen"><span class="avia_hidden_link_text">Per E-Mail teilen</span></a>The icon is missing for all others (data-av_icon=”” data-av_iconfont=”entypo-fontello”):
<a target="_blank" aria-label="Teilen auf Reddit" href="https://reddit.com/submit?url=xxx" aria-hidden="false" title="" data-avia-related-tooltip="Teilen auf Reddit" rel="noopener noreferrer"><span class="avia_hidden_link_text">Teilen auf Reddit</span></a>With the mouseover, only the remaining empty space (from padding) is recolored.
Enfold 4.7.4 / WordPress 5.2.6 / PHP 7.2.30
No error message with define (‘WP_DEBUG’, true) in wp-config.php.Thaks,
GünterHello,
I use post slider on my homepage. When the mouse is hovered on the images or the title, the title appears once again next to the cursor as a “tooltip”. I would like to hide this text. Can you give me a code and a short guidance, please?
Thank you in advance!
In reply to: Move logo and header widget behind #main content
Hi,
Thank you, please also look in your child theme style.css for:#search-2, div.avia-search-tooltip { top: 30px !important; left: -30px; }and change to:
div.avia-search-tooltip { top: 30px !important; left: -30px; }Then add this css:
@media only screen and (min-width: 989px) { #top #wrap_all #search-2 { top: 70px !important; right: 12%; } #top #custom_html-3 { top: 40px !important; right: 12%; } #top #custom_html-3 .custom-html-widget { height: 238px; width: 200px; } } @media only screen and (max-width: 988px) { #top #wrap_all #search-2 { top: 30px !important; right: 20px; } #top #custom_html-3 { top: 40px !important; right: 2%; } #top #custom_html-3 .custom-html-widget { height: 238px; width: 200px; } } @media only screen and (max-width: 767px) { .responsive #top .logo { top: 0 !important; } .logo a { top: 0px !important; } #top #wrap_all #custom_html-3 { top: 0px !important; } }and this function in your functions.php:
function custom_script(){ ?> <script> (function($){ $(document).ready(function(){ var width = $(window).width() if ((width >= 989)) { $( '#wrap_all' ).each(function() { $( this ).find( 'span.logo' ).insertAfter( $(this).find('div#main') ); $("span.logo").css({ 'position': 'fixed','z-index': '0' }); $( this ).find( 'div#search-2' ).insertAfter( $(this).find('div#main') ); $("div#search-2").css({ 'position': 'fixed','z-index': '0' }); $( this ).find( 'div#custom_html-3' ).insertAfter( $(this).find('div#main') ); $("div#custom_html-3").css({ 'position': 'fixed','z-index': '0' }); }); } else { $( '#wrap_all' ).each(function() { $( this ).find( 'span.logo' ).insertAfter( $(this).find('div#main') ); $("span.logo").css({ 'position': 'fixed','z-index': '501' }); $( this ).find( 'div#search-2' ).insertAfter( $(this).find('div#main') ); $("div#search-2").css({ 'position': 'fixed','z-index': '501' }); $( this ).find( 'div#custom_html-3' ).insertAfter( $(this).find('div#main') ); $("div#custom_html-3").css({ 'position': 'fixed','z-index': '501' }); }); } }); })(jQuery); </script> <?php } add_action('wp_footer', 'custom_script');Then clear your browser cache and check.
Best regards,
MikeHi there,
when you type something in our inner_tooltip menu searchform
the preview looks strange in chrome But its ok on firefox.
Can you help me?In reply to: Please contribute and translate Enfold
Hi,
Found several typos in original English:
“Some SEO plugins need to process shortcodes when bulding the header” -> should be ‘building’
“protocoll” -> “protocol”
“Load google fonts in footer”-> Google
“Only use if you know what you are doing ;)” -> ;-)
“The Font heading allows you to use a wide range of fonts for your headings. Uplooad your own fonts, use websave fonts (faster rendering) or Google webkit fonts (more unique).” -> Upload
“Show Thumnails and display post title by tooltip” -> Thumbnails
“Show Blog Sidebar on Archiv Pages” -> Archive
“Disable advance layout builder preview in backend” -> Advanced Layout Builder
“Hide badge and string completly on every page” -> completely
“instagram” -> Instagram (several places)
“Linkedin” -> LinkedInRegards,
Roger
PS Working hard on completing Dutch translationHi,
Thank you for the clarification. Looks like you have already managed to set the background transparency or color of the main containers to #ffffff00. Do you need more help with this?
You can also try this css code.
.main_color, .main_color .site-background, .main_color .first-quote, .main_color .related_image_wrap, .main_color .gravatar img .main_color .hr_content, .main_color .news-thumb, .main_color .post-format-icon, .main_color .ajax_controlls a, .main_color .tweet-text.avatar_no, .main_color .toggler, .main_color .toggler.activeTitle:hover, .main_color #js_sort_items, .main_color.inner-entry, .main_color .grid-entry-title, .main_color .related-format-icon, .grid-entry .main_color .avia-arrow, .main_color .avia-gallery-big, .main_color .avia-gallery-big, .main_color .avia-gallery img, .main_color .grid-content, .main_color .av-share-box ul, #top .main_color .av-related-style-full .related-format-icon, .main_color .related_posts.av-related-style-full a:hover, .main_color.avia-fullwidth-portfolio .pagination .current, .main_color.avia-fullwidth-portfolio .pagination a, .main_color .av-hotspot-fallback-tooltip-inner, .main_color .av-hotspot-fallback-tooltip-count { background-color: transparent; }Best regards,
IsmaelIn reply to: Add tooltip to Dots Menu
Hi,
Thank you for the inquiry.
1.) The theme doesn’t have this option by default but it should be possible. You have to find a way to add the data-avia-tooltip attribute and the avia-tooltip class name to the menu items. Unfortunately, this will require modification that is beyond the scope of support. Please hire a freelance developer or contact our partner, Codeable.
2.) You can add the css code in the Quick CSS field or the style.css file. However, please note that the one page dots menu is a custom modification in itself and the custom menu doesn’t respond to the current active section, so we won’t be able to target or apply a different style to the active menu item. If you only want to change the style of the dots, use this css code.
#top .dots-menu .av-subnav-menu li a { border: 1px solid grey; max-width: 25px; max-height: 25px; border-radius: 25px; overflow: hidden; padding: 0 !important; border: none !important; background: red; }Best regards,
IsmaelTopic: Add tooltip to Dots Menu
Hi guys,
Happy Easter to all!
1. It’s possible to add the tooltip to dots menu?
2. Where and how to add css code to implement the dots menu (eg colors, active, visited ecc ecc)I want create a simple one page with all tips for my forum custumers and the tooltips is the must kind to insert the title of the section
Thanks in advance
RegardsIn reply to: Icon grid two colums with a picture responsivity
Hi Zdenek,
For the icons, you need to have CORS enabled.
Please refer to this: http://kriesi.at/documentation/enfold/enable-cors/Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
@media only screen and (max-width: 989px) { .avia-icongrid-tooltip li .avia-icongrid-front, .avia-icongrid li .avia-icongrid-wrapper, .avia-icongrid-flipbox li .avia-icongrid-front .avia-icongrid-inner, .avia-icongrid-tooltip li article { min-height: 300px; } }If you need further assistance please let us know.
Best regards,
VictoriaIn reply to: The search bar is overlapping the menu
Hi,
Add this to quick css:
#av-burger-menu-ul{ padding-top:150px!important; } .avia-search-tooltip.avia-tt{ top:0px!important; }Best regards,
Jordan ShannonIn reply to: Customize new scroll down arrow in color section
Sorry, i’m not talking about the scroll to top button but the scroll down link, the arrow what sent you to the section down under.
I dont understand your css code. What are the classes “.avia_pop_class, .avia-search-tooltip”? Or do I need to fill in my own class here? The class of the scroll down arrow is:
#top .scroll-down-link { -webkit-animation: avia_fade_move_down 2s ease-in-out infinite; animation: avia_fade_move_down 2s ease-in-out infinite; bottom: 40px; }In reply to: Customize new scroll down arrow in color section
Hi,
You can apply a different animation to the scroll to top button using this css code.
.avia_pop_class, .avia-search-tooltip { -webkit-animation: avia_pop 0.3s 1 cubic-bezier(0.175,0.885,0.320,1.275); animation: avia_pop 0.3s 1 cubic-bezier(0.175,0.885,0.320,1.275); }avia_pop is a custom css animation.
@-webkit-keyframes avia_pop { 0% { -webkit-transform:scale(0.8); } 100% { -webkit-transform:scale(1); } } @-moz-keyframes avia_pop { 0% { -moz-transform:scale(0.8); } 100% { -moz-transform:scale(1); } } @-o-keyframes avia_pop { 0% { -o-transform:scale(0.8); } 100% { -o-transform:scale(1); } } @keyframes avia_pop { 0% { transform:scale(0.8); } 100% { transform:scale(1); } }You can create your own animation and apply it to the button.
Best regards,
IsmaelHi,
First Social Sharing Icons Question
I am trying to get my EmEnfoldold social sharing Icons to show up on every page, right above the footer (See Attachment). The way I have added these so far is simply by going into everyone of my pages (on the WordPress side) and placed the Enfold Social Sharing block at the bottom. I have tried adding the following html of the Enfold Social Share Icons to the footer.php file via ftp so that it shows up on all pages. However, when adding them to the footer.php file, when on Product pages, it doesn’t share the corresponding Product, instead it shares the shop page meta data and not the product. How can I get it to show up universally throughout the website in the footer? As you can see, there are no product pages on the WordPress end where I can add these to the bottom like with other pages. You can see a screenshot here of where it should show up in the product pages (Attachment)Here is the HTML/Default Editor version of the social share section I tried implementing into the footer:
<div id="sharethebeauty_custom-block-id" class="av-layout-grid-container entry-content-wrapper main_color av-flex-cells avia-builder-el-7 el_after_av_masonry_entries avia-builder-el-last sharethebeauty_custom-block-css-class submenu-not-first container_wrap fullsize" style=" "> <div class="flex_cell no_margin av_one_full avia-builder-el-8 avia-builder-el-no-sibling sharethebeauty_custom-cell avia-full-stretch " style="vertical-align:middle; padding:30px 60px 30px 60px ; "><div class="flex_cell_inner"> <div id="sharethebeauty_custom-ID" class="av-social-sharing-box sharethebeauty_custom-css-class avia-builder-el-9 avia-builder-el-no-sibling sharethebeauty_custom-css-class "><div class="av-share-box"><span class="share-label">Share</span><h5 class="av-share-link-description av-no-toc ">Share The Beauty</h5><ul class="av-share-box-list noLightbox"><li class="av-share-link av-social-link-facebook"><a target="_blank" aria-label="Share on Facebook" href="https://www.facebook.com/sharer.php?u=https://timfloresphoto.com/shop/&t=Shop" aria-hidden="false" data-av_icon="" data-av_iconfont="entypo-fontello" title="" data-avia-related-tooltip="Share on Facebook" rel="noopener noreferrer"><span class="avia_hidden_link_text">Share on Facebook</span></a><div class="avia-related-tooltip avia-tt" style="top: -31px; left: 19.5px; display: none; opacity: 0;"><div class="inner_tooltip">Share on Facebook</div><span class="avia-arrow-wrap"><span class="avia-arrow"></span></span></div></li><li class="av-share-link av-social-link-twitter"><a target="_blank" aria-label="Share on Twitter" href="https://twitter.com/share?text=Shop&url=https://timfloresphoto.com/?p=4121" aria-hidden="false" data-av_icon="" data-av_iconfont="entypo-fontello" title="" data-avia-related-tooltip="Share on Twitter" rel="noopener noreferrer"><span class="avia_hidden_link_text">Share on Twitter</span></a><div class="avia-related-tooltip avia-tt" style="top: -31px; left: 208.567px; display: none; opacity: 0;"><div class="inner_tooltip">Share on Twitter</div><span class="avia-arrow-wrap"><span class="avia-arrow"></span></span></div></li><li class="av-share-link av-social-link-pinterest"><a target="_blank" aria-label="Share on Pinterest" href="https://pinterest.com/pin/create/button/?url=https%3A%2F%2Ftimfloresphoto.com%2Fshop%2F&description=Shop&media=" aria-hidden="false" data-av_icon="" data-av_iconfont="entypo-fontello" title="" data-avia-related-tooltip="Share on Pinterest" rel="noopener noreferrer"><span class="avia_hidden_link_text">Share on Pinterest</span></a><div class="avia-related-tooltip avia-tt" style="top: -31px; left: 397.133px; display: none; opacity: 0;"><div class="inner_tooltip">Share on Pinterest</div><span class="avia-arrow-wrap"><span class="avia-arrow"></span></span></div></li><li class="av-share-link av-social-link-linkedin"><a target="_blank" aria-label="Share on LinkedIn" href="https://linkedin.com/shareArticle?mini=true&title=Shop&url=https://timfloresphoto.com/shop/" aria-hidden="false" data-av_icon="" data-av_iconfont="entypo-fontello" title="" data-avia-related-tooltip="Share on LinkedIn" rel="noopener noreferrer"><span class="avia_hidden_link_text">Share on LinkedIn</span></a></li><li class="av-share-link av-social-link-tumblr"><a target="_blank" aria-label="Share on Tumblr" href="https://www.tumblr.com/share/link?url=https%3A%2F%2Ftimfloresphoto.com%2Fshop%2F&name=Shop&description=High%20Resolution%20Images%20from%20around%20the%20world%20for%2050%25%20Off.%20Download%20Now%21%20%28Code%3A%20Life%29" aria-hidden="false" data-av_icon="" data-av_iconfont="entypo-fontello" title="" data-avia-related-tooltip="Share on Tumblr" rel="noopener noreferrer"><span class="avia_hidden_link_text">Share on Tumblr</span></a></li><li class="av-share-link av-social-link-reddit"><a target="_blank" aria-label="Share on Reddit" href="https://reddit.com/submit?url=https://timfloresphoto.com/shop/&title=Shop" aria-hidden="false" data-av_icon="" data-av_iconfont="entypo-fontello" title="" data-avia-related-tooltip="Share on Reddit" rel="noopener noreferrer"><span class="avia_hidden_link_text">Share on Reddit</span></a></li><li class="av-share-link av-social-link-mail"><a aria-label="Share by Mail" href="mailto:?subject=Shop&body=https://timfloresphoto.com/shop/" aria-hidden="false" data-av_icon="" data-av_iconfont="entypo-fontello" title="" data-avia-related-tooltip="Share by Mail"><span class="avia_hidden_link_text">Share by Mail</span></a></li></ul></div></div>Last Social Sharing Icons Question
How can I add these social sharing icons right underneath the Add to Cart Button (and Save Wishlist Button)? If possible, I would like to avoid editing any functions file to avoid possible web speed decreases.
Example of where placement should go.You can view my website at the following:
Website:
https://timfloresphoto.com/shopWebsite Product:
https://timfloresphoto.com/product/upper-antelope-canyon-falls/Looking forward to hearing back from you :)
Topic: social icons not showing
Hello,
As the topic name implies, we have problems in displaying the social icons on the secondary bar above the main menu.
(The site url is provided in the “private content” section of this message)
The steps we made are described as follows:
– we went on Theme options > Social profiles, selected the social icons we wanted (in this case facebook and Instagram), and added the proper url for each.
– then we went on Theme options > Header > Additional elements and selected in the header social icon dropdown the option “show on the left .in the upper bar”
– we clicked on the blue button “save all changes”
However, the result is that no icon can be seen in the upper bar of the frontend.
When pointing the mouse in the place where the icons are supposed to be, a colored square appears (with a tooltip displaying the related social media name), but no more than this.
Same result when changing the location on the header social icon dropdown of Theme options > Header > Additional elements.
Of course, we would like the true icons to be always fully visible.
Did we missed some configuration step and / or made something wrong? Just for the matter of clarity, we add that the linked social profiles are both existing and do not have any issue.
Thanks in advance of ny help you can give.In reply to: sortable toggles filter as icons
Hello Mike!
Mny thanks for your help.
well done, 2 Js Errors are solved,
– but with these changes, now appears this Js error:
Uncaught TypeError: t.AviaTooltip is not a constructor
at HTMLDocument.<anonymous> (avia-footer-scripts-1bc06c48412e8e2b10d52187e577b9ed—5e70b61ec198e.js:2)
at i (jquery.js?ver=1.12.4-wp:2)
at Object.add [as done] (jquery.js?ver=1.12.4-wp:2)
at n.fn.init.n.fn.ready (jquery.js?ver=1.12.4-wp:2)
at avia-footer-scripts-1bc06c48412e8e2b10d52187e577b9ed—5e70b61ec198e.js:1
at avia-footer-scripts-1bc06c48412e8e2b10d52187e577b9ed—5e70b61ec198e.js:29
—–
I saw that you had already put the correct settings in autooptimize and Asynk Javascript,
By changing those settings, I have activated the optimization of the javascript code from enfold-child Joining Javascript files and compression, to always have optimized javascript.
then I noticed that the lazy load of the images no longer worked and I activated it in Autoptimize. But I have to exclude masonry galleries from slow loading (they don’t work with lazy load) and I can’t find the exact name to be included in Autooptimize exclusions. Maybe you can enter it?So far I think all is well (although I prefer your confirmation :-))
I did a tour on the site and ajax recearch no longer works well, not from the previews on the same page; I’d like to avoid sending visitors to the search page, because there would be too many slow queries.
Best regards,
S.In reply to: suppress tooltips in Icon Grid
Dear Mike and all,
I need to come back to this.
The plugin supressed the tooltips globaly but now I need it at a different page (hotspots on a worldmap).
Is there a way to supress the tooltips only in the gridrow?Thank you in adavance
Rainer
In reply to: Contact Form – Datepicker / german localisation
You can find the link in the private content. The german translation is not the best for the button, the word is too long.
In english it should be “Prev” and “Next” so in german “Zurück” and “Weiter”
Or just use Arrows with tooltips.
Du kannst hier einen immer noch aktuellen Lösungsansatz finden: https://kriesi.at/support/topic/one-google-map-marker-tooltip-at-a-time/#post-932107
Mittlerweile wird die avia_google_maps_api.js conditional geladen. Heißt nur im Bedarfsfall. Macht es aber einfacher, dieses als child-theme script zu laden. ( Please dear mods – if this enqueue code could be optimized – tell us)
Das hier kommt also in die child-theme functions.php:add_action( 'wp_enqueue_scripts', 'wp_change_google_maps_script', 100 ); function wp_change_google_maps_script() { wp_deregister_script( 'avia_google_maps_api_script' ); wp_enqueue_script( 'avia_child_google_maps_api_script', get_stylesheet_directory_uri().'/js/avia_google_maps_api.js', array('jquery'), $vn, true ); }du legst dir eine Kopie dieser Datei in den child-theme/js/ Ordner ( der ist per se nicht unbedingt da, dann leg ihn an)
Diese Kopie bearbeitest du entsprechend dem Link oben ( bitte beachte den Eintrag ganz oben – das vergessen viele)
ODER : Auf Grundlage von enfold 4.7.3
oder hier sehen: https://pastebin.com/9vUQrcFD
hier downloaden: https://pastebin.com/dl/9vUQrcFD
Ich habe Kommentare mit hineingeschrieben, damit du dich erinnerst was passiert ist.Auch wenn du nur irgendwo auf die Karte klickst gehen die InfoWindows zu.
https://webers-testseite.de/google-maps-infowindow/_______________________________
English Part for the interested other Participants:
You can find a still up-to-date solution here: https://kriesi.at/support/topic/one-google-map-marker-tooltip-at-a-time/#post-932107
Meanwhile the avia_google_maps_api.js is loaded conditionally. This means only if required. But makes it easier to load it as child-theme script. ( Please dear mods – if this enqueue code could be optimized – tell us )
So this one goes into the child-theme functions.php:add_action( 'wp_enqueue_scripts', 'wp_change_google_maps_script', 100 ); function wp_change_google_maps_script() { wp_deregister_script( 'avia_google_maps_api_script' ); wp_enqueue_script( 'avia_child_google_maps_api_script', get_stylesheet_directory_uri().'/js/avia_google_maps_api.js', array('jquery'), $vn, true ); }you put a copy of these files in the child-theme/js/ folder (it is not necessarily there per se, then create it)
Edit this copy according to the link (please note the entry at the top of the page – many people forget this)
On the basis of enfold 4.7.3
or see here: https://pastebin.com/9vUQrcFD
download here: https://pastebin.com/dl/9vUQrcFD
I’ve included comments so you’ll remember what happened.Even if you just click somewhere on the canvas the InfoWindows will close.
https://webers-testseite.de/google-maps-infowindow/Moin Moin!
Ich habe eine Google Map mit verschiedenen Markern auf meiner Website. Diese Marker öffnen ein Tooltip, sobald man sie anklickt. Leider bleiben die bereits geöffneten Tooltips offen, wenn man Neue öffnet.
Ich möchte gerne, dass immer nur ein Tooltip zur Zeit geöffnet ist.
Gibt es dazu eine Funktion, die ich übersehen habe oder wie stelle ich das am besten an?Vielen Dank und einen schönen Tag :)
Is there a way to force the image with hotspots to not stack tooltips below image on mobile, but stay like we see on larger screens and touch the hotspots to reveal the tooltips?
In reply to: I can't set a link at a hotspot
Hey,
Thanks for contacting us!
Please edit your Hotspot tooltip and scroll down to find link options. I attached a screenshot in private content field below :)
Best regards,
YigitHallo,
maybe i’m blind – but i can’t find the place where a hotspot is linked.
I found this
but even there I see no indication of where I can put an href.
When I click on a hotspot (backend), I see ‘edit hotspot tooltip’; if I put a link there, nothing happens afterwards.
Don’t see the problem…. what I do wrong.
Please help.
Thanks
In reply to: smaller font for mobile
thank you, solved the issue
@media only screen and (max-width: 325px) {
body, body .avia-tooltip {
font-size: 16px !important;
}
}
did the trick ;)In reply to: Icon grid stacked on top of each other (no spacing)
Hi,
Thank you for the update.
We added the following code in the Quick CSS field to fix the issue on mobile view temporarily.
.avia-icongrid-tooltip li article { position: relative; min-height: 250px; }We will also report the issue to our channel and let you know if an actual fix is ready.
Best regards,
IsmaelIn reply to: Search icon on left menu
on the first link ( with only the zoom glass) :
on hamburger case you can force both besides each other with some css like:@media only screen and (max-width: 989px) { .responsive.html_header_sidebar #header .av-main-nav > li { margin: 0; } } @media only screen and (max-width: 767px) { .responsive #top .av-main-nav .menu-item-avia-special { float: left; } }the styling of the active input field on non-hamburger case can be done too with css in quick css – but we had to know how it should look like for you.
f.e. the width and that little arrow pointing to the magnifier etc:.avia-search-tooltip { width: 250px; } .avia-search-tooltip .avia-arrow-wrap { left: 10%; }
