-
Search Results
-
I was looking for a different onhover effect for the Enfold portfolio. With the help of some Googling I changed the arrow to a slideover-excerpt-text effect.
To change this you have to know how to code – preferably in a child theme that you can download here:http://bit.ly/enfold-child
Example of onhover effect:
http://i40.tinypic.com/ndvqpz.jpg
What did i change:
PORTFOLIO.PHP (Version: 2.4.5)New code:
somewhere from line 395 (fullwidth portfolio) I changed some settings and added some classes. This is not very clean code but it can help you achieve this very easily.else { $extraClass .= ' default_av_fullwidth '; $output .= "<div data-ajax-id='{$the_id}' class=' rozepitem grid-entry flex_column isotope-item all_sort {$style_class} {$post_class} {$sort_class} {$grid} {$extraClass}'>"; $output .= !empty($excerpt) ? "<a href='{$title_link}' title='".esc_attr(strip_tags($title))."'><div class='rozeptxt grid-entry-excerpt entry-content' ".avia_markup_helper(array('context'=>'entry_content','echo'=>false)).">".$excerpt."</div></a>" : ''; $output .= "<article class='main_color inner-entry' ".avia_markup_helper(array('context' => 'entry','echo'=>false)).">"; $output .= apply_filters('avf_portfolio_extra', "", $entry); $output .= "<".$link_markup[0]." data-rel='grid-".avia_post_grid::$grid."' class='grid-image avia-hover-fx'>".$custom_overlay.get_the_post_thumbnail( $the_id, $image_size )."</".$link_markup[1].">"; $output .= !empty($title) || !empty($excerpt) ? "<div style='z-index:100;box-shadow: 0px -5px 20px #888888;' class='grid-content'><div class='avia-arrow'></div>" : ''; if(!empty($title)) { $markup = avia_markup_helper(array('context' => 'entry_title','echo'=>false)); $output .= '<header style="z-index:100;" class="entry-content-header">'; $output .= "<h3 class='grid-entry-title entry-title' $markup><a href='{$title_link}' title='".esc_attr(strip_tags($title))."'>".$title."</a></h3>"; $output .= '</header>'; } $output .= !empty($title) || !empty($excerpt) ? "</div>" : ''; $output .= '<footer class="entry-footer"></footer>'; $output .= "</article>"; $output .= "</div>"; } $loop_counter ++; $post_loop_count ++; $extraClass = ""; if($loop_counter > $columns) { $loop_counter = 1; $extraClass = 'first'; } }Then i added a jQuery part in a JS file (e.g. shortcodes.js):
$('.rozeptxt').animate({ opacity:'0', top:'300px', }); $('.rozepitem').hover( // Over function(){ $(this).find('.rozeptxt').animate({ opacity:'0.9', top:'0px', }); } , // Out function(){ $(this).find('.rozeptxt').animate({ opacity:'0', top:'300px', }); } );In the custom CSS-field I added this:
.image-overlay { display: none!important; } .entry-title {font-weight:bold;font-size:13pt;} .rozeptxt{color:#7c6853;font-size:13pt;position: absolute;top:0px;left:0px; background: rgba(255,255,255,0.9);width: 100%;height: 100%;z-index:50;padding:20px;} .rozepitem{display: block;float: left; position: relative;overflow:hidden;}I know the code can be a lot cleaner, but i saw other people wanting this – so maybe this helps them create something awesome.
hello kriesi team,
i got an issue with the heading and menu fonts. they do not render correctly in safari and firefox but look good in chrome (on mac – didn’t check windows yet) the heading problem seems to occur every time i put an a special heading element inside a layout element. since i do not see the same issues on the enfold sample page i really wonder what it is that causes this issue. here is a screen shot comparing the browser and showing the problem:
http://chrisbuchner.com/wp-content/uploads/2014/01/browser-check.png
as you can also see, the logo looks very rugged in firefox whereas it is resized smoothly in other browsers.
last but not least i also tried to change the height to which the header resizes when scrolling down (using these instructions https://kriesi.at/support/topic/logo-and-main-header-menu/#post-212922 // https://kriesi.at/support/topic/change-logo-image-for-scrolled-header/#post-188003)
when I change the value to 1.5 the header becomes even smaller first and jumps back the actual value eventually. how could i change this behavior ?
many thanks, chris.
Hi,
I’m looking to change the size (and maybe font colour) of the Headings that are displayed with Accordion element and also Tabs element. I find they are too small on mobile devices, so increasing the heading size will make it easier for them to be pressed (perhaps increasing padding too).
Thanks a lot
Michael
Topic: Fonts
I see there are less than 50 fonts for the body text. How can I add all of the Google fonts to the list? Also, how can change the font size to the body and headings. My URL is http://www.headmenco.com.
1 – please send the code to target the font color in the icon list so we can match it with the main content font colour.
2 – if we want to change the type sizes etc… for a specific page is there a simple way to do this?
3 – how to set up the header fonts so they get proportionally smaller in pad or phone mode?
4 – This question from 2 weeks ago was never answered: When we switch to default editor it is no longer possible to edit a page created with the advanced layout builder – the entire page simply disappears in the editor. The possibility to use short code becomes impossible.
It would be great if you would add an alphabetical list of the main HTML/CSS/PHP code to alter main items in the website so we can just look up instead of asking. Would save both parties much time.
Hello,
I’m trying to make the terms and conditions checkbox line more visible on the checkout page. I’ve tried using the code from this post https://kriesi.at/support/topic/moving-the-accept-terms-and-conditions-checkbox/
#payment .terms {
font-size: 15px !important;
}in my custom css, but it is not changing the font size. Any suggestions.
Thank you for your help.
Topic: Misalignment of icons
Hi again,
I’m having problems when using the icons, they seem to shift the text associated with it, here’s a screenshot:

You can view the page here:
http://padmayoga.dk/wp/kontakt/Here’s the code used:
[av_two_third first] <h5>Adresse</h5> Elisagårdsvej 12 • 4000 Roskilde [/av_two_third] [av_one_third] <h5>Vær social</h5> [av_font_icon icon='ue8f4' font='entypo-fontello' style='' caption='' link='manually,http://facebook.com' linktarget='_blank' color='' size='40px' position='left'][/av_font_icon] [av_font_icon icon='ue8f7' font='entypo-fontello' style='' caption='' link='manually,http://google.com' linktarget='_blank' color='' size='40px' position='left'][/av_font_icon] [/av_one_third]What can I do to align the headers ?
Thanks

