Forum Replies Created
-
Posts
-
if you really mean that it is only for mobile devices you an use this into your child-theme functions.php:
add_action( 'wp_head', 'landingpage_for_mobile', 10 ); function landingpage_for_mobile() { if(wp_is_mobile()){ ?> <script> if (window.location.pathname == '/' ) { window.location = "/imprint/"; } </script> <?php } }in this case the imprint page will be the landing page for mobile devices.
or if you do not like to use the edited alb elements you can replace only that specific heading by this function in child-theme functions.php:
function replace_tags_with_tags(){ ?> <script> (function($) { function replaceElementTag(targetSelector, newTagString) { $(targetSelector).each(function(){ var newElem = $(newTagString, {html: $(this).html()}); $.each(this.attributes, function() { newElem.attr(this.name, this.value); }); $(this).replaceWith(newElem); }); } replaceElementTag('.page-id-14 .avia-slideshow-1 .slide-1 h2.avia-caption-title', '<h1></h1>'); }(jQuery)); </script> <?php } add_action('wp_footer', 'replace_tags_with_tags');you see that line:
replaceElementTag('.page-id-14 .avia-slideshow-1 .slide-1 h2.avia-caption-title', '<h1></h1>');you can add there as many lines as you like – if you are more specific with the selector you can be very strict in replacing
these lines must be semicolon separated.F.e. – if you have there :
replaceElementTag('.slide-1 h2.avia-caption-title', '<h1></h1>');every first slide in a slide-show will have a h1 tag then
if you like to set the heading tag on each slide in a different way – you can use my edited enfold alb elements.
But read carefully – on slider you need 4 files to substitute: https://webers-testseite.de/edited-enfold-alb-elements/you can put this into your child-theme functions.php:
function my_avf_customize_heading_settings( array $args, $context, array $extra_args = array() ) { if( $context == 'avia_slideshow' ) { $args['heading'] = 'h1'; $args['extra_class'] = 'is-h1'; } return $args; } add_filter( 'avf_customize_heading_settings', 'my_avf_customize_heading_settings', 10, 3 );just give that custom-class ( in my case it is : is-h1 ) to the fullscreen-slider
every slide-show with that class will turn the default h2 to h1 tag then.
if you are using a child-theme ( and i alway recommend that) you can replace the logo by adding something like this to your child-theme functions.php
add_filter('avf_logo','av_change_logo'); function av_change_logo($logo){ if( is_page(121) ) { $logo = "https://bright.itsomimedia.nl/wp-content/uploads/Bright_academy_bgwit3.png"; } return $logo; }btw: you can have more substitutions like this way with all conditional possiblities you like:
add_filter('avf_logo','av_change_logo'); function av_change_logo($logo){ if( is_page(121) ) { $logo = "https://bright.itsomimedia.nl/wp-content/uploads/Bright_academy_bgwit3.png"; } if ( is_page( array( 42, 54, 6 ) ) ) { $logo = "http://www.domain.com/wp-content/uploads/logoforpage22.jpg"; } if ( is_page() && !is_page(1307) ) { $logo = "http://www.domain.com/wp-content/uploads/logoforpage23.jpg"; } return $logo; }etc. pp.
none No capitalization. The text renders as it is. This is default
capitalize Transforms the first character of each word to uppercase
uppercase Transforms all characters to uppercase
lowercase Transforms all characters to lowercase
initial Sets this property to its default value.
inherit Inherits this property from its parent element.Sorry i thought this was clear where to replace!
#top #wrap_all .all_colors h1, #top #wrap_all .all_colors h2, #top #wrap_all .all_colors h3, #top #wrap_all .all_colors h4, #top #wrap_all .all_colors h5, #top #wrap_all .all_colors h6 { text-transform: none; }by the way: on wpml – this is the reason why i recommend finishing the styling of the main language and then synchronize these settings on each language version of the page.
That could be done by import/export : Export Theme Settings File / Import Theme Settings File.it is possible – but the methods are different on some cases.
If you use WPML – ( some people say it is a bug : i think it is a feature ) every language has its own enfold options page.
So you could have different logos on those Input Fields ( you can see on top f.e.: Enfold Child (EN) Theme Options )
different quick css etc. pp.If you are using alternative language plugins – there must be equivalent methods – or you can do it via that filter: avf_logo
etc. pp. it would be nice to see the live-site link to give better advice.if your topmenu isn’t to big ( and i suppose that there is not enough place to have there a great menu) – wouldn’t it be easier and on performance reasons better to add those items manually to the main-menu and set those menu-items to display none on non-mobile case?
hm – i mean in this combination – i have altered the code above to :
function transfer_url_to_subject_field(){ ?> <script> (function($){ var urlQuery; var chopquery = function() { var match, pl = /\+/g, // Regex for replacing addition symbol with a space search = /([^&=]+)=?([^&]*)/g, decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); }, query = window.location.search.substring(1); urlQuery = {}; while (match = search.exec(query)) urlQuery[decode(match[1])] = decode(match[2]); } chopquery(); $('span.checkbox-403').find('input[value="' + urlQuery["trigger"] + '"]').prop("checked", true); })(jQuery); </script> <?php } add_action('wp_footer', 'transfer_url_to_subject_field');and the checkbox 403 has a lot of entries in my form ( see private Content)
is it possible to have an urlquery with multiple params in the link – and if : check both checkboxes.
if I had no respect for simple questions here, then I would be satisfied with hints at the solution approach. But I often mean to formulate precise instructions here. Some people may even be disturbed by the detail and illustrations – and many are not interested in a learning curve but just want to get the solution in the form of short snippets. But despite everything the questions are often not precise enough.
You presented me a picture of the slider above; then I mistakenly assumed that you wanted to achieve that. But in the end it’s not much different than the described procedure, because as the mods here already indicated, it’s not an ALB element, but just like I indicated above simple html insertion and css styling. So please always try to be as specific as possible in your question in order to avoid superfluous solutions.ps: on that case – you had to define the animation for those button container. That comes from slider description container. – but can be translated to it
And dear Gitte you aren’t able to transmit the more complicated case to an easier one?
the html code is above – put it in a text-block or code block element – the rest only had to be adjusted to not specific for sliders:.avia-double-buttons { margin-top: 30px; text-align: center; position: relative; } #top #wrap_all .avia-double-button, #top #wrap_all .avia-double-button { background: #000; background: rgba(0,0,0,0.4); border-color: #fff; color: #fff; padding-bottom: 11px; text-decoration: none; } #top .avia-double-button { letter-spacing: 1px; padding: 13px 20px; padding-bottom: 13px; text-transform: uppercase; font-size: 13px; text-align: center; min-width: 175px; display: inline-block; transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -webkit-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; border: 4px solid #fff; border-top-color: rgb(255, 255, 255); border-right-color: rgb(255, 255, 255); border-right-width: 4px; border-bottom-color: rgb(255, 255, 255); border-left-color: rgb(255, 255, 255); text-decoration: none; } #top .avia-double-button-1 { border-top-left-radius: 100px; border-bottom-left-radius: 100px; border-right-width: 2px; } #top .button_or { position: absolute; display: block; height: 26px; line-height: 21px; width: 40px; text-align: center; top: 50%; left: 50%; margin: -13px 0 0 -22px; background: #fff; color: #666; border-radius: 100px; font-size: 12px; border: 2px solid #FFF; font-style: italic; font-weight: 600; z-index: 11; } #top .avia-double-button-2 { border-top-right-radius: 100px; border-bottom-right-radius: 100px; border-left: none; border-left-color: currentcolor; } #top #wrap_all .main_color .avia-double-button-1:hover, #top #wrap_all .main_color .avia-double-button-1:hover { background: rgba(0, 100, 190, 0.6); color: #fff; } #top #wrap_all .main_color .avia-double-button-2:hover, #top #wrap_all .main_color .avia-double-button-2:hover { background-color: rgba(200,0,120,0.6); color: #fff; } @media only screen and (max-width:480px) { .responsive #top .avia-double-button { width:50%; min-width:50%; margin:0 } }see test page
if you want to use a entypo-fontello font icon put in like that:
instead of the u in ue808 there must be a backslash..comment-header::after { content: "\e808"; font-familiy: entypo-fontello; … }if you are using win keyboards the back-slash got his own sign on keyboard
on mac keyboard you will find the backslash on :
⇑ ⌥ 7 : shift alt 7
(Alt could be named option key)1) make a: Fullwidth Easy Slider
2) choose slide-show transition : fade
3) place an image and put html-code into : caption – caption text field:
<div>A subheading line included before the buttons</div><div class="avia-double-buttons "><a href="https://kriesi.at/themes/enfold-overview/" class="avia-double-button avia-double-button-1">View Demos</a><span class="button_or">or</span><a href="https://themeforest.net/item/enfold-responsive-multipurpose-theme/4519990?ref=Kriesi" class="avia-double-button avia-double-button-2">Purchase Now</a></div>(put it in without line-breaks !)
As you see – you can add infront of the buttons a subheading line!4) put this to your quick css:
.avia-double-buttons { margin-top: 30px; text-align: center; position: relative; } #top #wrap_all .avia-slide-wrap .avia-double-button, #top #wrap_all .avia-hover-fx .avia-double-button { background: rgba(0,0,0,0.2); border-color: #fff; color: #fff; padding-bottom: 11px; text-decoration: none; } #top .avia-double-button { letter-spacing: 1px; padding: 13px 20px; padding-bottom: 13px; text-transform: uppercase; font-size: 13px; text-align: center; min-width: 175px; display: inline-block; transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -webkit-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; border: 4px solid #fff; border-top-color: rgb(255, 255, 255); border-right-color: rgb(255, 255, 255); border-right-width: 4px; border-bottom-color: rgb(255, 255, 255); border-left-color: rgb(255, 255, 255); text-decoration: none; } #top .avia-double-button-1 { border-top-left-radius: 100px; border-bottom-left-radius: 100px; border-right-width: 2px; } #top .button_or { position: absolute; display: block; height: 26px; line-height: 21px; width: 26px; text-align: center; top: 50%; left: 50%; margin: -13px 0 0 -14px; background: #fff; color: #666; border-radius: 100px; font-size: 10px; border: 2px solid #FFF; font-style: italic; font-weight: 600; z-index: 11; } #top .avia-double-button-2 { border-top-right-radius: 100px; border-bottom-right-radius: 100px; border-left: none; border-left-color: currentcolor; } /** if you like to have different hover colors **/ #top #wrap_all .main_color .avia-slide-wrap .avia-double-button-1:hover, #top #wrap_all .main_color .avia-hover-fx .avia-double-button-1:hover { background: rgba(0, 100, 190, 0.6); color: #fff; } #top #wrap_all .main_color .avia-slide-wrap .avia-double-button-2:hover, #top #wrap_all .main_color .avia-hover-fx .avia-double-button-2:hover { background-color: rgba(200,0,120,0.6); color: #fff; }for responsive behavior – test what fits best as width value:
@media only screen and (max-width:767px) { .responsive #top .avia-double-button { width:50%; min-width:50%; margin:0 } }So you don’t have to be afraid with the normal version either. I have several Urls running on one API, and get regular monthly bills for 0,00Euro.
is it possible to check multiple boxes in the same checkbox list ?
f.e. if there is a button with “i’m interested in callback and e-mail contact”i do not see your private content – but i suppose it is a svg file – which needs a width setting on chrome.
by the way – i use the reCaptcha v3 with CF7 in Enfold – that works even with js compression.
and i only load those scripts for contact form pages
by replacing one line in class-grecaptcha.php ( line 271)
from :$regex = "!\[av_contact!";
to:$regex = "!\[contact-form-7|\[av_contact!";thanks for the hint :
my solution now is ( because the youtube links : images with link to youtube films with iframe=true) have on lightbox-added the additional class: mfp-iframe i can do it this way:
1) i gave the data-group to lightbox-added – then to mfp-iframe – so they got different data-groups
2) and i had to add the main-class to magnific popup uses on enfold case to work properly
3) i have to do it with window load not document ready// custom lightbox function add_custom_script_lightbox(){ ?> <script> (function($){ $(window).load(function() { $('.lightbox-added').attr('data-group', '1'); $('.mfp-iframe').attr('data-group', '2'); var groups = {}; $('.lightbox-added').each(function() { var id = parseInt($(this).attr('data-group'), 10); if(!groups[id]) { groups[id] = []; } groups[id].push( this ); }); $.each(groups, function() { $(this).magnificPopup({ type: 'image', mainClass: 'avia-popup mfp-zoom-in mfp-image-loaded', closeOnContentClick: false, closeBtnInside: false, gallery: { enabled:true } }) }); }); })(jQuery); </script> <?php } add_action('wp_footer', 'add_custom_script_lightbox');do not forget to set the ::-moz-selection
But how to influence ( hook to ) the enfold lightboxes – not the inline popups.
by the way – you see the link in private content. This is no gallery from the start. There are on that page different media files which have all a lightbox link.
The default enfold way on the alb to have lightbox.
I want to avoid that all media files are part of the “gallery” in the lightbox by clicking the next (or prev.) Button. On default Enfold behavior it is different Media files in different color-section are not part of one lightbox gallery.So is there a way to split in a layout without color-sections f.e. videos in one lightbox – images in the other?
so for that i had to create a plugin/shortcodes folder ?
Wouldn’t it be better to work with the mostly already existing one in child-themes/shortcodes folder ?after the code Rikard gave to you – the font could be used on quick css this way:
font-family: 'Russo One', sans-serif;to register it for enfold options you can place this to child-theme functions.php :
add_filter( 'avf_google_heading_font', 'avia_add_custom_font'); add_filter( 'avf_available_google_fonts', 'avia_add_custom_font'); function avia_add_custom_font($fonts) { $fonts['Russo One'] = 'Russo+One&display=swap'; return $fonts; }The Font is at the bottom of the list!
look for example : https://www.sparkasse-koelnbonn.de/de/home.html
in the footer area – same here – no enfold – this is a matter of browser behavior.If you will pick up a link – then a webloc file is copy pasted and look like this f.e.
A Link should work as a link. But if you place the cursor next to a link so that not the hand but the cursor (selector) is visible, you can also copy a link textually if you don’t have a tremor.
If you select text with links in it – only the text will be copied.
Click what i mean. here: Link
you can see the selection color on the white pages :
this is exactly the background-color of the footer / socket and the font color is white.
So if you “select” text it will not be seen.!Please enter first my css code then we can discuss if it is a bug or a feature-
because if you drag that onto your desktop besides the browser – it will create a text copy of that selected and draged part ( on mac it does)
