Forum Replies Created
-
AuthorPosts
-
Tell me if you have seen and understand the procedure.
then i will get rid of your logos and reconstruct my settings.hm a few weeks ago your request – and now my example has gone – anyway.
No – my solution is a single solution no additional code :lol:to functions.php of your child-theme:
add_filter('avf_logo_subtext', 'kriesi_logo_addition'); function kriesi_logo_addition($sub) { $sub .= " <a href= 'the link target url' target='_blank' > <img class='anything' title='anything' src='link to your image' alt='anything you like' /></a> "; return $sub; }
to quick css:
.logo a { float: left; } .logo img {max-width: 200px}
the gimmick is that you can use a different link , a different link-behavior (open in new tab etc) and it did all the normal logo does – even shrinking is possible.
The other problematik is a thing that all users have if the logo is more or less a panorama apect ration. Has nothing to do with two logo or not.
You have to have an earlier breakpoint for responsive behavior. – thats all
But try first to set up your header behavior to “Let logo and menu position adapt to browser window” and have a look if this is not better for your big menu.You can see it on my test-page here: https://webers-testseite.de/buttons/
On very small screen – both logos are beneath each other !so everything works fine on all browser – go and get it.
Concerning to this question: https://kriesi.at/support/topic/blog-beitrage-sortieren/#post-865474
i think i got a solution – allthough i don’t realy know why it works:
You will have on widget area a new widget called : Enfold-Child Social Bookmarks
drag and drop as usual into the widget area you like. It shows the social bookmarks you have choosen on Enfold Options Dialog.
Only Title is here to set ( Default is “Social Bookmarks”)Just one moment – i will check to mangage for all widget areas to solve it …
to quick css:
#top .socialbookmarks-widget .social_bookmarks { float: left; margin: 15px 0 0 ; position: relative; } #top .socialbookmarks-widget .social_bookmarks li { float: left; clear: right !important; }
to enfold-child functions.php
function social_bookmarks_register_widget() { register_widget( 'add_social_bookmarks' ); } add_action( 'widgets_init', 'social_bookmarks_register_widget' ); class add_social_bookmarks extends WP_Widget { public function __construct() { $widget_ops = array( 'classname' => 'socialbookmarks-widget', 'description' => __('A widget that displays the social bookmarks', 'avia_framework') ); parent::__construct( 'add_social_bookmarks', THEMENAME.' Social Bookmarks', $widget_ops ); } public function widget( $args, $instance ) { $title = apply_filters( 'widget_title', $instance['title'] ); echo $args['before_widget']; //if title is present if ( ! empty( $title ) ) echo $args['before_title'] . $title . $args['after_title']; //output echo $before_widget; $social_args = array('outside'=>'ul', 'inside'=>'li', 'append' => ''); echo avia_social_media_icons($social_args, false); echo $after_widget; } public function form( $instance ) { if ( isset( $instance[ 'title' ] ) ) $title = $instance[ 'title' ]; else $title = __( 'Social Bookmarks', 'avia_framework' ); ?> <p> <label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( 'Title:' ); ?></label> <input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo esc_attr( $title ); ?>" /> </p> <?php } public function update( $new_instance, $old_instance ) { $instance = array(); $instance['title'] = ( ! empty( $new_instance['title'] ) ) ? strip_tags( $new_instance['title'] ) : ''; return $instance; } }
hey – to make it more simple (for the enduser) i tried to make a custom widget
see here: https://webers-testseite.de/buttons/#footerbitte schön – gern geschehen – nicht so viel Feedback auf einmal!
so now i have splitted the styling and the colors
as described you have to take the light-transparent styling of enfold and put in two classes
one for the style and one for colors- This reply was modified 7 years, 1 month ago by Guenni007.
what do you think about that:
Using the Enfold Button Element with light-transparent but with other styling – just css
give the new class to the button (here it is glass green)
put in the field of custom css : glass green
for blue one : glass blue do not put in the classes with the dot (point) ! those are added by default
etc if you likehttps://webers-testseite.de/buttons/
/* to get rid of enfold styling - use light-transparent */ #top .avia-button.avia-color-light { color: inherit !important; border: none !important; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; box-shadow: none !important } #top .avia-button.avia-color-light:hover { opacity: 0.9 !important; text-shadow: 1px 1px 2px #333 } /* font-size of the button and the icon */ #top .avia-button.avia-color-light { font-size: 1.2rem } .avia-button.avia-color-light .avia_button_icon { font-size: 1.5rem; vertical-align: bottom } /* new button style - a bit glassy */ .glass { position: relative; display: inline-block; border-radius: 4px; box-shadow: 1px 1px 4px #666; /* goes to style the text */ text-decoration: none; text-shadow: 1px 1px 2px #333; } .glass:before{ content: ''; position: absolute; top: 2px; left: 2px; width: calc(100% - 4px); height: 50%; } .glass:before{ background: linear-gradient(rgba(255,255,255,0.8), rgba(255,255,255,0.2)) } /* the green one */ .green { background-color: green; /*for compatibility with older browsers*/ background-image: linear-gradient(green,lightgreen); color: #fff } .green:hover { background: linear-gradient(#073,#0fa) } /* the blue one */ .blue { background-color: blue; /*for compatibility with older browsers*/ background-image: linear-gradient(blue,lightblue); color: #fff } .blue:hover { background: linear-gradient(#047,#0ef) } /* the red one */ .red { background-color: red; /*for compatibility with older browsers*/ background-image: linear-gradient(#ea0404 ,#6d0019); color: #fff } .red:hover { background: linear-gradient(#a00,#e00) }
and now the rest is your turn – make some other classes with other gradients!
Here you can make your gradients: Link
by the way: if you like to have it under the normal widget area of enfold –
use this hook:add_action( 'avia_after_footer_columns', 'enfold_under_footer_widget_area' ); function enfold_under_footer_widget_area() { dynamic_sidebar( 'after-footer' ); }
hey mike this was nearby my method i used for one customer:
i used a bit different hook: mine is already in the footer containeradd_action( 'avia_before_footer_columns', 'enfold_customization_footer_widget_area' ); function enfold_customization_footer_widget_area() { dynamic_sidebar( 'before-footer' ); }
same as Mike described – create a new widget area (in my case call it) : before-footer
The rest will be some debug mode action :lol: ( on widgets we are able to use avia shortcodes ? – yes )
means – activate debug mode and than goto a page or post and do create your needed columns and contents.
copy the shortcode from the debug mode window and paste it to your new widget area. Bingoyou can clean it a bit – because there are a lot of settings not used in the shortcodes
See here: https://webers-testseite.de/#footer
Big Advantage – the columns break with enfold settings in responsive case. because they are based on enfold shortcode
See short form of your wanted code here for your 2/3 1/3 option:
[av_two_third first] [av_heading heading='Left Heading' tag='h3' style='blockquote modern-quote'][/av_heading] [av_textblock ] Left 2/3 Content [/av_textblock] [/av_two_third] [av_one_third ] [av_heading heading='Right Heading' tag='h3' style='blockquote modern-quote' ][/av_heading] [av_textblock ] Right 1/3 Content [/av_textblock] [/av_one_third]
if you like to have the same heading style:
#footer h3 { font-weight: 600; letter-spacing: 1px; text-transform: uppercase; }
- This reply was modified 7 years, 1 month ago by Guenni007.
or – if this is the font-resizer you are using do this to your child-theme functions.php:
function font_resize_shortcode() { return fontResizer_place(); } add_shortcode('font-resize', 'font_resize_shortcode');
and add this to your phone number field:
[font-resize]
the rest will be css ( height and floating behavior)hey Basilis – i’m playing a bit with the plugin and all is fine for blog pages. But i can not see on how to style it for pages that are made with avia layout builder.
I can insert in the field “custom amp editor” and use this it is ok.
But i guess if the page is built by the alb – the amp page builder does not work – and menu does not work at all.But did a linked url has to be readable as url ? For SEO options this is not necessary to have it.
That is the reason for buttons , Text links etc.
Why it is important for you to show the whole url? you can set a “read more…” etc.
even this will do it – and it looks very clear without the linked url : f.e:
Owner/Builder Risk (3 articles)you can make it as Icon List Small
and have for pdfs a pdf icon in front etc. pp.- This reply was modified 7 years, 1 month ago by Guenni007.
Lol – Basilis – this link seems to be more relevant for the most of the users: https://de.wordpress.org/plugins/accelerated-mobile-pages/
by the way: nice tip. Looks good !
And by the way all concerns to the same hook ( ava_after_main_menu) this is the elegant method – but if you like to add to a different hook ( not only the ava_after_main_menu ) in the header area you only have to change the functions name.
A function needs to be bijective – one-to-one , if not you got your white screenadd_action( 'ava_after_main_menu', 'enfold_customization_header_widget_area' ); function enfold_customization_header_widget_area() { dynamic_sidebar( 'header' ); } add_action( 'ava_main_header', 'a_different_function_name' ); function a_different_function_name() { dynamic_sidebar( 'headertel' ); }
October 20, 2017 at 5:41 pm in reply to: Need layer slider blank template / wir brauchen Layer Slider leere Vorlage #866810wofür ? als Weißpunkt abgleich ? Ich verstehe das Begehren nicht.
Was ist der Zweck eines solchen Unterfangens?you will find the settings on shortcodes.css look for :
/*animation variations*/f.e.:
.avia_transform .avia_start_delayed_animation.bottom-to-top { -webkit-animation: avia-btt 0.8s 1 cubic-bezier(0.165, 0.840, 0.440, 1.000); /* Safari 4+ */ animation: avia-btt 0.8s 1 cubic-bezier(0.165, 0.840, 0.440, 1.000); /* IE 10+ */ opacity: 1; }
try this above ( 2 rules)
.js_active .grid-image { opacity: 1 !important; } .avia-slideshow li { visibility: visible; opacity: 1 !important; }
After that we will see if the functionality is ok – because on my simulation the slider did not work.
did you deactivate all the third party plugins ? And look if it works than.
I see you got jetpack and something like custom facebook feed etc pp.
Try this first – and activate the caching plugins at last – because otherwise you have to clear cache allways before seeing results.
than activate one after the other and see if there are some inconsitstencies.- This reply was modified 7 years, 1 month ago by Guenni007.
don’t know where it comes from. I have to have a deeper look to your codes :
but first look if you have set an opacity to 0
add to quick css :.js_active .grid-image { opacity: 1 !important; }
don’t know if the important is necessary – try it first without – that is one part of the solution.
Now i have to look to slider.and try that with your image:
.av-caption-image-overlay-bg { opacity: 1 !important; transform: scale(0.9); background-image: url(https://sanotech.my-tagit.be/wp-content/uploads/2017/10/service_bg-e1508262915962.jpg); background-size: cover; }
or play a bit with opacity (by the way – maybe it is better to have webkit-opacity too)
.av-caption-image-overlay-bg { -webkit-opacity: 0.7 !important; opacity: 0.7 !important; transform: scale(0.9); background-image: url(https://sanotech.my-tagit.be/wp-content/uploads/2017/10/service_bg-e1508262915962.jpg); background-size: cover; background-color: #fff !important; }
ok – a screenshot isn’t the way a good advice can be given.
The code above works (as you can see on my page above on image overlay )To have only the colored field behind:
.av-caption-image-overlay-bg { opacity: 1; background-color: #1885ad; transform: scale(0.9); }
you than have to do this with caption text:
.av-image-caption-overlay-center { padding: 20px; }
does your Font Resizer support shortcodes to insert it?
because you can insert in phone info field shortcodes too !
if no support for it : create your own shortcode for that font-resizer !
i would try to eliminate the fontello icon and than place instead a background-image:
.image-overlay .image-overlay-inside::before { background: url(https://homeurl/wp-content/uploads/2015/07/service_bg.jpg); background-repeat: no-repeat; background-size: cover; content: "\00a0" !important; }
see here: Link
if you like to influence the transparency of the overlay color:.avia_transform a:hover .image-overlay { opacity: 0.8 !important; }
- This reply was modified 7 years, 1 month ago by Guenni007.
aha – that is the malus if i can not see the site to which it concerns .
no header_meta there – no success
great – has he a link to the page in private content ?
:lol
As far as i know – He likes to have this element only for his site. There is no such element. And i see that there is some extra javascript on that element.
öffne dein svg mal in einem Editor (nicht text editor oder wordpad, die fügen blödsinnigen code hinzu – nimm notepad++ oder eben sublime text am mac)
das sieht man oben im Kopf (ps ich entferne immer die generator zeile) dann so aus:
<?xml version="1.0" encoding="utf-8"?> <svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 821.8 296.7" style="enable-background:new 0 0 821.8 296.7;" xml:space="preserve">
Durch hinzufügen einer Anweisung nimmt man einfluss auf das Shrink Verhalten und die Position in der Viewbox:
<?xml version="1.0" encoding="utf-8"?> <svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 821.8 296.7" style="enable-background:new 0 0 821.8 296.7;" preserveAspectRatio="xMinYMid meet" xml:space="preserve">
dann bleibt das svg linksbündig und wird aber in der höhe vermittelt !
oder eben hier runterladen: Link
bisher soweit ich sehe alles ok –
bitte noch die Anweisung.logo img { display: none }
entfernen -
AuthorPosts