Hi there
Is there a way to have a colour section with a video showing on desktop devices and then have Advanced Layer Slider show on mobile devices automatically?
Hi vadikcoma,
You could use this:
#bonuses .av-styling-no-styling .avia_image {
top: 200px;
}
But your Layer Slider has slides of different height, which does not make it look good. It should be 640-700px height, than this solution will be fine. Otherwise, you’ll need to use JavaScript to watch the image and control it.
Best regards,
Victoria
Hi,
I simply added !important rule as following and that helped
#top #header_main > .container .main_menu ul:first-child > li > a {
line-height: 155px !important;
}
Please review your website :)
Best regards,
Yigit
Hi,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:
#header .widget {
left: 5%;
padding-top: 0;
position: absolute;
top: 36%;
z-index: 999;
}
Best regards,
Yigit
I used the following codes
#header_main.container_wrap.container_wrap_logo {
background-color: #000000;
}
@media only screen and (max-width: 767px) {
.responsive .logo a, .responsive .logo {
width: 100%!important;
}
.responsive .logo img {
margin: auto;
}
.header_color img {
padding-top: 0;
}
#header {
height: 220px!important;
}
#advanced_menu_toggle {
top: 150%;
right: 46%;
}
}
@media only screen and (max-width: 767px) {
.responsive #top .cart_dropdown {
top: 150%;
right: 1%;
}
}
Hi,
yes, I just fixed it.
– But now I have to much white space between the mobile menu and the pages. How can I fix it?
– Also the logo needs to have some black margin on the top and bottom because now it is squeezed.
– And I cannot find a code to stick the mobile cart icon on the right corner.
Could you help me with these issues?
Many thanks
Hi,
I managed to put this code together which does close the search results after a click of the mouse.
add_action('wp_footer', 'close_search_on_click');
function close_search_on_click(){
?>
<script type="text/javascript">
jQuery(document).on('click',function(){
jQuery(".ajax_search_response").hide('slow');
});
jQuery(".ajax_search_response").on('click',function(e){
e.stopPropagation();
});
</script>
<?php
}
The downside is that after the search results close, if I retype something else on the search bar, I don’t get anymore search results. Could you help me with the code that will refresh that dropdown after typing?
Thanks
Hi,
1.) Use this code:
@media only screen and (max-width: 767px) {
.responsive #top
.cart_dropdown {
right: 24%;
}
.main_menu .avia-menu {
right: -7%;
}}
and adjust as needed.
2.) Try this:
span.av-hamburger-box::before {
content: 'menu';
}
.header_color .av-hamburger-inner, .header_color .av-hamburger-inner::before, .header_color .av-hamburger-inner::after {
background: none;
}
3.) This:
@media only screen and (max-width: 767px) {
.cart_dropdown_first
.cart_dropdown_link {
font-size: 20px;
}}
Best regards,
Andy
Hello,
Please take a look at this post:
https://kriesi.at/support/topic/read-more-button-in-the-overlay-masonry/
I’m using this code for the ‘read more’ link at the portfolio items.
Can I use a Advanced custom field before this excerpt?
I’ve altered the code to this:
//Read more masonry
add_filter(‘avf_masonry_loop_prepare’,’avia_change_default_link’, 10, 2);
function avia_change_default_link($loop, $entries)
{
foreach($entries->posts as $key => $entry)
{
if($entry->post_type == “portfolio”)
{
$klantnaam = get_field(‘klantnaam’);
$more = “<br /><span class=’masonry-more-link-arrow’>”.$klantnaam.” | Bekijk project</span>”;
$loop[‘content’] = avia_backend_truncate($entry->post_content, apply_filters( ‘avf_masonry_excerpt_length’ , 60) , apply_filters( ‘avf_masonry_excerpt_delimiter’ , ” “), “…”, true, ”) . $more;
}
}
return $loop;
}
Where ‘klantnaam’ is the advanced custom field.
Greets Jeen
Hi,
just go to the url of the website : https ://www.fnh-expert.net and open the login box at the top of the header, ypur details are in the private contents.
I just try it and it’s ok
Hi,
you could try this code:
.entry-content {
top: 100px;
position: relative;
}
Adjust top value as needed. Please open a new ticket for a new question, otherwise it gets quite confusing for us.
Best regards,
Andy
Hi,
I would try to remove all customizations you’ve implemented so far. So deactivate your child theme and remove any custom code, to make sure you’ve got a clean Enfold installation. Also keep all plugins but WooCommerce by WooThemes deactivated while testing.
If does not work, try this code inside Quick CSS field as a workaround:
p.price {
top: 125px;
left: 107px;
position: relative;
z-index: 100;
}
and adjust top and left value as needed.
Best regards,
Andy
Hi,
so you want to use a different menu for mobile, right? if yes then follow this: https://kriesi.at/support/topic/different-menu-on-mobile-view/#post-443746
You could also use a plugin for such a function.
Best regards,
Andy
Hi,
I a little puzzled by this. In a text block, I have several paragraphs of content which I would like to space out a little more between the paragraphs. I have tried adding a break tag <br> tag but found this to be too much and adding <p> is of no use.. it just gets removed by the editor.
I then added:
[av_hr class='invisible' height='20' shadow='no-shadow' position='center' custom_border='av-border-thin' custom_width='50px' custom_border_color='' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='yes' custom_icon_color='' icon='ue808' font='entypo-fontello' admin_preview_bg='']
…which works but makes the editor look far too busy when figuring out what the content is.
Is there a better way to do this?
Cheers
John
Hi,
Thanks for the feedback, let us know if you should need any further help on the topic.
Best regards,
Rikard
Hi,
Do you have an active menu on the site? You can check under Appearance->Menus. Please post a link to your site if you should need any further help on the topic.
Best regards,
Rikard
hi there,
as you can see i am using media queries to adjust the padding between the rows on the homepage.
for desktop the padding between the rows should be 50px.
On mobile and tablet the padding should be 20px.
I managed to get this to work on most rows.
i am having some issues however getting this to work for the row highlighted in below screenshot. can you please help resolving this?
View post on imgur.com
many thanks
Hey danldurall,
Have you been able to view this thread?
Perhaps it will help?
Best regards,
Jordan Shannon
Hi,
Thanks for that. Please try swapping the CSS your are using now with this:
#header .widget {
padding-top: 0;
position: absolute;
top: 0;
z-index: 999;
right: 5%;
}
Best regards,
Rikard
Hi,
Is your goal to remove the white space above your menu bar so it is at the top of the screen?
Best regards,
Mike
Hi,
Yes that is your config file, it’s encrypted.
It is strange that you have no top bar or left side dashboard, yet you do have a login screen?
Can you take a full screenshot of what you see right after login?
Best regards,
Mike
Hey typhonconsulting,
Do you mean you want to stop the arrow overlay from showing?
Best regards,
Jordan Shannon
Hey a3brown4,
Please see the following thread and see if this can aid you:
Best regards,
Jordan Shannon
there is a cool background animation I want to add to one of my pages (only to this one specific page)
It’s pretty simple and it look like this (the link is in the private content)
Problem is it needs two JS files to run (sketch.min.js and index.js)
I’ve tried numerous ways to get this work with enfold (from other threads in this forum) but none of them worked
..i think the only way might work as adding them as function to the Functions.php like stated here https://kriesi.at/support/topic/add-javascript-to-page/#post-497269
BUT i’m not sure:
1. how can use this solution with for two scripts instead of one?
2. how can I limit them to work in only one specific page (in my case -my home page)?
Hi,
Let us know if you need more assistance regarding this topic or if we can close the thread :)
Best regards,
Nikko
Hi Trevor,
Can you try adding this css code in Quick CSS (located in Enfold > General Styling):
#top.single-portfolio .avia-slideshow-inner {
height: auto !important;
}
Let us know if this helps.
Best regards,
Nikko
Hi Isamel
I don’t remember how I did that – but see this thread: https://kriesi.at/support/topic/mobile-menu-33/#post-440877. Appears code was added to get extra mobile menu options, but there was a problem…
I remember that the THEMENAME was a glitch that could not be worked out here.
can we fix this? The menu on the mobile is very messed up now, but had worked until the recent update
-
This reply was modified 8 years, 10 months ago by
Munford.
Hey Eric,
Try adding this css code in Quick CSS (located in Enfold > General Styling):
#top .avia-logo-element-container .slide-entry-wrap {
text-align: center;
}
#top .avia-logo-element-container .slide-entry {
float: none;
display: inline-block;
}
Hope this helps :)
Best regards,
Nikko
Hey Zaccc,
Try adding this css code in Quick CSS (located in Enfold > General Styling) for the white in the cart (there are 2 buttons there):
#top .dropdown_widget .buttons .button {
background: #666;
}
As for the dropdown, it doesn’t show anything because the dropdown options are empty though I can see that there are values on the empty options. See screenshot in private content.
Best regards,
Nikko
LParticipant
Hi Nikko,
Regarding the solution you provided on this topic – https://kriesi.at/support/topic/swap-columns-on-mobile/
It worked only if the columns are set to standard settings with individual height.
If we set column settings of Equal Height Columns to ‘Equal’ and Vertical Alignment to ‘Middle’ this code is not working anymore:
@media only screen and (max-width: 767px) {
.column-push-pull .entry-content-wrapper {
display: flex !important;
flex-direction: column-reverse;
}
}
Can you please set a page with Color section, including two columns inside it, set the Equal height to Equal and Vertical Alignment to Middle test it on your Enfold environment?
Regards