http://abload.de/img/enfold_hotspots1v2rm1.jpg
http://abload.de/img/enfold_hotspots2qfpfx.jpg

Please look at the screens. It’s not just changing to 14px. If you go to 14px or more, it will start looking ugly (I think I could use another Tooltip Width here which I wouldn’t like). But, hey, I set it to 13px and that’s fine for me.

I hope I made myself clear with the screens, and as I said, I still don’t understand the difference between “Top right” and “Right Top”.

This is not such a big one, I know, but I think you and me can get st out of it at least.

Have a good time! :-)

Here is the issue in pictures:

First
Second
Third
Fourth

I hope that helps you understand the issue we are having. We want the tooltips to stop jumping below their respective lines when they load the images inside them. These images are not large so we do not understand why they would load so slowly and effect the tooltip as they are.

• This reply was modified 10 years, 3 months ago by jaimemerz.

Nope, doesn’t work sadly. Still pops for half a second.

This is the custom css (child theme) I have on the search field. But tried inserting it in Enfold custom CSS as well. Didn’t work.

  
.avia-search-tooltip { /* wider search field */
    width: 400px;
    border-bottom: none;
    opacity: 0;
}

#top #searchform>div {
    max-width: none;
}

@media only screen and (max-width: 989px) { /* helps search icon appear on mobile in hamburger menu. Found it on kreisi support */
    #top #searchform>div {
        display: block !important;
        opacity: 1 !important;  
        padding: 0 1em;
    }
}

And thanks :)

• This reply was modified 10 years, 3 months ago by Emilvillumsen.

Brilliant, that’s changed the text colour….

Now for the background?! You see where the background of the tooltip box is the same colour as the dark red background – we need to be able to change that to say a pale blue…

Thanks for the tip re hex codes too

Hi,
found the answer on an older post – .avia-tooltip, .avia-tooltip .avia-arrow { background: #0ee0aa !important; }
Job done!
Cheers, Rob

awesome, thanks it worked.

Just curious, what is the best way to find for example that specific div class?

I tried to mark the title container in firebug but on the left side on your demo for example I see:

stretch_full container_wrap alternate_color light_bg_color title_container

and on right:

.alternate_color, .alternate_color .site-background, .alternate_color .first-quote, .alternate_color .related_image_wrap, .alternate_color .gravatar img .alternate_color .hr_content, .alternate_color .news-thumb, .alternate_color .post-format-icon, .alternate_color .ajax_controlls a, .alternate_color .tweet-text.avatar_no, .alternate_color .toggler, .alternate_color .toggler.activeTitle:hover, .alternate_color #js_sort_items, .alternate_color.inner-entry, .alternate_color .grid-entry-title, .alternate_color .related-format-icon, .grid-entry .alternate_color .avia-arrow, .alternate_color .avia-gallery-big, .alternate_color .avia-gallery-big, .alternate_color .avia-gallery img, .alternate_color .grid-content, .alternate_color .av-share-box ul, #top .alternate_color .av-related-style-full .related-format-icon, .alternate_color .related_posts.av-related-style-full a:hover, .alternate_color.avia-fullwidth-portfolio .pagination .current, .alternate_color.avia-fullwidth-portfolio .pagination a, .alternate_color .av-hotspot-fallback-tooltip-inner, .alternate_color .av-hotspot-fallback-tooltip-count {
background-color: #fcfcfc;
color: #888888;
}

.alternate_color, .alternate_color div, .alternate_color header, .alternate_color main, .alternate_color aside, .alternate_color footer, .alternate_color article, .alternate_color nav, .alternate_color section, .alternate_color span, .alternate_color applet, .alternate_color object, .alternate_color iframe, .alternate_color h1, .alternate_color h2, .alternate_color h3, .alternate_color h4, .alternate_color h5, .alternate_color h6, .alternate_color p, .alternate_color blockquote, .alternate_color pre, .alternate_color a, .alternate_color abbr, .alternate_color acronym, .alternate_color address, .alternate_color big, .alternate_color cite, .alternate_color code, .alternate_color del, .alternate_color dfn, .alternate_color em, .alternate_color img, .alternate_color ins, .alternate_color kbd, .alternate_color q, .alternate_color s, .alternate_color samp, .alternate_color small, .alternate_color strike, .alternate_color strong, .alternate_color sub, .alternate_color sup, .alternate_color tt, .alternate_color var, .alternate_color b, .alternate_color u, .alternate_color i, .alternate_color center, .alternate_color dl, .alternate_color dt, .alternate_color dd, .alternate_color ol, .alternate_color ul, .alternate_color li, .alternate_color fieldset, .alternate_color form, .alternate_color label, .alternate_color legend, .alternate_color table, .alternate_color caption, .alternate_color tbody, .alternate_color tfoot, .alternate_color thead, .alternate_color tr, .alternate_color th, .alternate_color td, .alternate_color article, .alternate_color aside, .alternate_color canvas, .alternate_color details, .alternate_color embed, .alternate_color figure, .alternate_color fieldset, .alternate_color figcaption, .alternate_color footer, .alternate_color header, .alternate_color hgroup, .alternate_color menu, .alternate_color nav, .alternate_color output, .alternate_color ruby, .alternate_color section, .alternate_color summary, .alternate_color time, .alternate_color mark, .alternate_color audio, .alternate_color video, #top .alternate_color .pullquote_boxed, .responsive #top .alternate_color .avia-testimonial, .responsive #top.avia-blank #main .alternate_color.container_wrap:first-child, #top .alternate_color.fullsize .template-blog .post_delimiter, .alternate_color .related_posts.av-related-style-full a {
border-color: #e1e1e1;
}

.title_container {
position: relative;
}

Yes now I understand and I could maybe guess that I could put .alternate_color and .title_container together because I know it is the title container, but when I am looking to find the specific div class I have selected on other places where I maybe dont know what you have labeled the exact container class I am looking at, how am I supposed to find it out of all the other million classes that is bunched together and share the same settings / color?

It’s not really an option to make a reset of Enfold, I would consider that too dangerous close to our launch :/ .

I made a child theme with many custom css lines. Don’t see any that should interfere negatively with the accordion, though. Didn’t touch that one specifically.

I made a few lines in the functions.php and added a custom 404.php. No changes to the theme files besides that.

These are the lines in the child theme functions.php:

<?php

/*
* Add your own functions here. You can also copy some of the theme functions into this file. 
* WordPress will use those functions instead of the original functions then.
*/

/* 
REMOVES KRIESI LINK IN THE SOCKET
*/

add_filter("kriesi_backlink","new_link");
function new_link(){
$kriesi_at_backlink = "";
return $kriesi_at_backlink;
}

/* 
REMOVES IMAGE FILE NAME ON HOVER LANDING PAGE HOTSPOTS
*/

function add_custom_tooltip(){
?>
<script>
jQuery(window).load(function(){
jQuery('a').removeAttr('title');
jQuery('img').removeAttr('title');
});
</script>
<?php
}
add_action('wp_footer', 'add_custom_tooltip');

/* 
PLACES SEARCH IN HAMBURGER MENU ON MOBILE
*/

add_filter( 'wp_nav_menu_items', 'avf_add_search', 3, 2 );
function avf_add_search( $items, $args ) {
	if ($args->theme_location == 'avia')
	{
		$search = '<li id="menu-item-search-mobile" class="menu-item menu-item-type-post_type menu-item-object-

page current-menu-item page_item page-item-18 current_page_item menu-item-top-level menu-item-top-level-

5">'.get_search_form(false).'</li>';
		$items = $search . $items;
	}
	return $items;
}

/* 
ALLOWS US TO SET A CUSTOM SHOP PAGE
*/

add_theme_support( 'avia_custom_shop_page' );