Forum Replies Created
-
AuthorPosts
-
hm – just the rearrangement did the trick ? OK
Is it important to have allways the add_action first and than the function.Because a lot of php tips here on board handle it this and that way?
for fancybox and other lightbox plugins there are (not so easy solutions) – but we have here on default an eventlistener implemented in enfold (aren’t we?) so in my JS suit (it is less than yours) i thought those JS Cracks here could handle it.
did you see my link? i changed a bit the code and on my end here on Mac OSX Sierra :lol: on all installed browsers( safari, safari technology preview, chrome, opera, firefox) it works nice – but on ipad i had this “jitter”
isn’t it possible to make it more specific and give the color-section a custom class and make it via this class?
it is not so implausible to have another av_section_4 on different pages/postson shortcodes.js from line 900 you have :
case "youtube": var params = _self.$video.data(); if(_self._supports_video()) params.html5 = 1; _self.player = new YT.Player(_self.$video.attr('id'), { videoId: params.videoid, height: _self.$video.attr('height'), width: _self.$video.attr('width'), playerVars: params, events: { 'onReady': function(){ _self.$option_container.trigger('av-video-loaded'); }, 'onError': function(player){ $.avia_utilities.log('YOUTUBE ERROR:', 'error', player); }, 'onStateChange': function(event){ if (event.data === YT.PlayerState.ENDED) { var command = _self.options.loop != false ? 'loop' : 'av-video-ended'; _self.$option_container.trigger(command); } } } });
isn’t it possible to insert here some code to close the iframe in
if (event.data === YT.PlayerState.ENDED)
Ok – there is on child-theme functions.php allready a test for autoclose lightbox after youtube video stops – but it does not work now
it is much more complicated from the inner of the iframe to close the iframe after playing. But to prove the avia.js case you can erase it here.Maybe yu got an idea – pleas look to the other thread
https://kriesi.at/support/topic/autoclose-video-lightbox/-
This reply was modified 8 years, 6 months ago by
Guenni007.
well there is inside the iframe a class added after video play. ended-mode
but i don’t know how to close the parent div (maybe : div.mfp-container ) if the class exists.i look into youtube video player api there are eventlisteners which might help
i think it will be nice to give a unique ID to that video
-
This reply was modified 8 years, 6 months ago by
Guenni007.
i have the same since 3.8.x (in my case 3.8.4)
i allways update via ftp and work with child-themes so i can do a complete Update ( delete enfold folder and upload the new one)same here on standard editor no text mode to activate.
i’m talking about the shrink process – the pixalized logo is the other question.
Now you did change both values – and the shrinking is now fluently with no jump to an endpoint.
i do not see how you influenced transparency on scrolling
i changed the frontpage to transparency and glassy like you had. And there is no fluctuation on transparency amount.
because see here: http://webers-testseite.de/ikom/you can influence the change point on avia.js a bit more down (line 1650ff) ( default value is 50 – i changed it in the example above to 100)
so after 100px scrolling the transparency of the glassy header goes to its given opacitybut on your installation there is a “little pulsation” i don’t know where it comes from
if(transparent) { if(st > 100) { //header.removeClass('av_header_transparency'); av_change_class(header, 'remove', 'av_header_transparency'); } else { //header.addClass('av_header_transparency'); av_change_class(header, 'add', 'av_header_transparency'); } }
do i need than the class-framework-widget ? : NO
i only have to get rid of this layout.css rule set to importantThanks – as allways !
this works too – because post_tag is an args too and its easier for me to rememberadd_filter( 'widget_tag_cloud_args', 'avia_change_tag_cloud' ); function avia_change_tag_cloud($args) { if ( isset($args['taxonomy'])){ $args['taxonomy'] = 'post_tag'; $args['number'] = 60; $args['smallest'] = 8; $args['largest'] = 20; $args['order'] = 'RAND'; } return $args; }
these two values are only the same for value 2 because scroll way and shrinked height of the header are only on that case the same.
i can see it in your avia.js – that you have set both to the same Quotient
did you read it carefully? i can see that your logo jumps after scrolling to its end height, and transparency has strange behavior – so try the values noted on the code
your header starts at 220px (custom value) you want to end at 95px (?) so the distance you have to scroll for changing class of the header is 125px
if(shrinking && !isMobile) { if(st < el_height/1.76) { newH = el_height - st; if(st <= 0){ newH = el_height; } av_change_class(header, 'remove', 'header-scrolled'); //header.removeClass('header-scrolled'); } else { newH = el_height/2.31; //header.addClass('header-scrolled'); av_change_class(header, 'add', 'header-scrolled'); }
because 220/1.76 = 125
and 220/2,31 = 95,23that means – after scrolling down 125px the new Header Height is at its endpoint of 95px
this is elegant Yigit but the thing is that the number=0 has no influence. And i don’t know why. The number remains 45 (default as in https://codex.wordpress.org/Function_Reference/wp_tag_cloud )
Result here: Link
/**** not showing the normal menu nor the old responsive menu ******/ .js_active.html_burger_menu #avia-menu > li {display: none } #advanced_menu_toggle {display: none !important } /**** just to have a bit more width for both - logo and toggler ******/ .responsive #top #wrap_all .container { max-width: 95%; width: 95%; } /**** styling the burger menu ******/ .av-burger-overlay { box-shadow: -2px 0 10px #bbb; left: auto; max-width: 400px; } /**** one example to place icons infront of hamburger menu links ******/ #av-burger-menu-ul li#menu-item-437 a .avia-menu-text::before { content: "\e821 \00a0"; font-family: entypo-fontello; color: #0088BD} /**** background image to hamburger menu ******/ .av-burger-overlay-inner { background: url("/wp-content/uploads/burger-bg.jpg") no-repeat scroll 0 0 / cover ; } /**** background-color for hamburger menu icon ******/ .av-burger-overlay-active #top .av-hamburger-inner, .av-burger-overlay-active #top .av-hamburger-inner::before, .av-burger-overlay-active #top .av-hamburger-inner::after { background-color: #000 !important; } /**** search icon color in burger menu ******/ .av-burger-overlay-active #top #wrap_all #menu-item-search a, .av-burger-overlay-active #top #wrap_all #menu-item-search a:hover { color: #000; } /**** burger menu font color ******/ #av-burger-menu-ul li a { color: #000 !important; } /**** burger menu text shadow - if you like ******/ #av-burger-menu-ul li a .avia-menu-text { text-shadow: 1px 1px 3px #333; } /**** burger menu hover state ******/ #av-burger-menu-ul li a:hover .avia-menu-text { color: #0088BD; font-weight: 400; }
Only needed if your burger menu is not 100% width –
for the styling of the page if burger menu is active you have to make a copy of header.php to your child-theme folder:
look for<div id='wrap_all'>
and place just after it :<div class='mega-bg'></div>
so that there is :<div id='wrap_all'> <div class='mega-bg'></div>
/**** setting up an effect on burger menu active - you have to insert the code above to header.php for that ******/ .mega-bg { width:100%; height:500%; position:absolute; display:none; z-index:0; transition: all 1s linear 0; opacity: 0 } .av-burger-overlay-active .mega-bg { width:100%; height:500%; background:#fff; position:absolute; display:block; z-index:500; transition: all 1s linear 0; zoom: 1; filter: alpha(opacity=85); opacity: 0.85; }
December 13, 2016 at 2:31 am in reply to: Logo sliding up when scrolling down. (sticky logo?) #723492ok here we go:
i hope you work with child-theme because changeings are safe when updating the parent theme.
you need a copy of footer.php in Child-Theme folder of your installation.On bottom of that footer.php copy find
wp_footer()
and insert just beforedo_action('avia_after_wrap_all');
so than it looks like:do_action('avia_after_wrap_all'); wp_footer();
This gives us the oportunity to insert code here via child-theme functions.php, and to insert it not over all pages/posts but with some if clauses only there you need it.
Yes we could insert here directly the code we need but if we like to change it or do some other things on that position it is i think : best to do it this way.
_______________this goes to functions.php of your child theme (and you see here that this will only inserted on front-page – if you want to insert it globaly insert the code (
<a class="customclass" href="#"><img class="aligncenter" src="path to your logo"/>
) directly to footer php and forget functions.php just in front of thewp_footer();
)add_action('avia_after_wrap_all', function() { if (is_front_page() ) { ?> <a class="customclass" href="#"><img class="aligncenter" src="path to your logo"/> <?php } });
on quick css you setup :
.logo, .responsive .logo { display: none; } .customclass { position: absolute; top: 0; left: 50%; transform: translate(-50%); transition: all 1s linear 0s; z-index: 501; width: 15vw }
you have to play a bit with width and top value – maybe you have to set up some rules for responsive case .
aha – in layout.css there is a rule set to important concerning to font-size of cloud-tag entries.
deleting the !important rule works. i think it will be great if this is by default not set to !important. Those who do not like that weighting – could set an important rule to quick css.Edit The number set to zero means no limit – but no influence on that here ?
aha ok it is set by wordpress – i only looked into enfold options.
But on Enfold the weighting is suppressed. So there has to be an Enfold specific setting. Maybe it is possible to increase the number on that place.Edit: on
function widget($args, $instance) { wp_tag_cloud('smallest=12&largest=24&unit=px&number=0');
i have set it to those args – but is there a way to get it into child-theme setting ?
by the way: i changed it to:
wp_tag_cloud('smallest=12&largest=16&unit=px&number=0');
but it has no influence! ???
-
This reply was modified 8 years, 6 months ago by
Guenni007.
can i see the page too ! I’m using on default svg for logo files – and only if the logo has to be pixelbased (complex fotos or graphic) i’m forced to use pngs or jpgs.
So – i do not use a plugin for svg support. The simple solution for using svgs in wordpress is in child-theme functions.php :function custom_mtypes( $m ){ $m['svg'] = 'image/svg+xml'; $m['svgz'] = 'image/svg+xml'; return $m; } add_filter( 'upload_mimes', 'custom_mtypes' );
only there is no preview on media list – but you can use it everywhere.
The one thing to know is WordPress thinks these svgs got a width and height of 1px.
So it is recomended to set up these information in quick css.PS i changed it to a big amount of shrinking for another thread here on forum and placed an absolute Button above the logo – for you it is important to see only the logo under that button.
( it is nowif(st < el_height/1.01)
andnewH = el_height/3;
)-
This reply was modified 8 years, 6 months ago by
Guenni007.
December 11, 2016 at 12:10 pm in reply to: Logo sliding up when scrolling down. (sticky logo?) #722815PS i changed it to 1/100 amount) to see what i mean. And placed the News Button ( the “Logo” outside header) in the center
-
This reply was modified 8 years, 6 months ago by
Guenni007.
December 11, 2016 at 12:01 pm in reply to: Logo sliding up when scrolling down. (sticky logo?) #722814i think he likes to have a logo scrolling away with the rest shrinking. – but i believe, that this is with the logo inside header container impossible.
see here http://webers-testseite.de/ikom/ – for a different question i changed shrinking amount of the header to 1/3. The Logo (centered above the menu) shrinks to 1/3rdYou see that little button on the left (news) – this can be placed on the same place as the logo is – instead of your logo (setting up than the logo to display:none). It scrolls out as you like and is non-shrinking but header is shrinking. I think it will be possible to shrink it to nearly zero.
_________________
tell me if this might a solution for you.
What you need is a modified copy of header.php in child-theme functions and some csshm – if this will be nice enough for you – it is only css styling of new burger menu.
And with media-querries it works on all devices without falling back to old mobile advanced menuEs wäre leichter dir zu helfen, wenn wir die Testseite sehen könnten.
by the way here is the code to change if you have increased top-bar height (social bookmarks height)
on line 1623 :
if(st - 30 < el_height)
this is standard given top-bar height.
if you do not change here the 30 the main container is on starting already under the headersee here i increased the top-bar height to 40px (instead of 30 normal value)
i tried that – because in my remembering i did that allready a few month ago. But on one installation (all on latest updates Enfold and WP) on scrolling down ( f.e. 3 is set in for the 2) there are strange reactions on that.
On that test i had set the header height to 300px ( the same on not so extreme values – but calculating is much easier)
on reaching 200px ( the addition of class header-scrolled happend (2/3 ???) ) and the logo height than jumps to 1/3 of 300px (the setting)we have to think about the code because it only works with 2 – Why? : because scroll distance is on that point of change the rest of the distance to top is equal to scrolling-down distance 150px
but see case above with 3 – scrolling down 100px ( the distance to top is 200px)
so here is my quintessence: you have to set the first value to 1.5 and the second to 3
the scroll distance when the jump to the additional class must be on that point when it reaches the header height end point
the header should end at 100px (1/3) so we have to subtract 200px ( and 200px are 2/3 of starting header height! – on that code you have to take the reciprocal value 3/2 = 1.5see here: http://webers-testseite.de/ikom/
so this is the code ( from line 1604 of avia.js) on that :
if(shrinking && !isMobile) { if(st < el_height/1.5) { newH = el_height - st; if(st <= 0){ newH = el_height; } av_change_class(header, 'remove', 'header-scrolled'); //header.removeClass('header-scrolled'); } else { newH = el_height/3; //header.addClass('header-scrolled'); av_change_class(header, 'add', 'header-scrolled'); }
-
This reply was modified 8 years, 6 months ago by
Guenni007.
i don’t know where the point is and why it does not work – the concerning code is in avia.js:
if(shrinking && !isMobile) { if(st < el_height/2) { newH = el_height - st; if(st <= 0){ newH = el_height; } av_change_class(header, 'remove', 'header-scrolled'); //header.removeClass('header-scrolled'); } else { newH = el_height/2; //header.addClass('header-scrolled'); av_change_class(header, 'add', 'header-scrolled'); } if(st - 30 < el_height) { av_change_class(header, 'remove', 'header-scrolled-full'); } else { av_change_class(header, 'add', 'header-scrolled-full'); } elements.css({'height': newH + 'px', 'lineHeight': newH + 'px'}); logo.css({'maxHeight': newH + 'px'}); }
-
This reply was modified 8 years, 6 months ago by
Guenni007.
Was ist mit diesem Rätselwort gemeint.
Das Verhältnis von Ausgangsgröße zu geschrumpfter Größe ist schon beeinflussbar:in avia.js line 1618 da ist die Zeile:
newH = el_height/2;
https://kriesi.at/support/topic/controling-the-size-of-shrinking-header/
schau da mal nach – ich habe es noch nicht getestet
-
This reply was modified 8 years, 6 months ago by
Guenni007.
ah – thats fine – looks better!
goto bwp minify options and change the cache on tab two “General Options” the cache age to 365 days.
-
This reply was modified 8 years, 6 months ago by
-
AuthorPosts