Alright, thank you! :) Please close this topic.
Thank you! :) You can close this topic.
Hi Bruno!
Can you please post a link to an example site which is responsive and not using a mobile menu?
There are couple of plugins that you can try but i believe mobile menu is the best way to control menus on small screensizes where having a desktop menu would cover most of the space :/
Best regards,
Yigit
It’s same. Thank you! :)
Please close this topic.
Hey!
If you would like to temporarily disable it, please add following code to Quick CSS
#scroll-top-link { display: none !important; }
Regards,
Yigit
Hey there, is it possible to
have the masonry blog set as the desktop version and if you go to the site with your mobile device
that it changes to blog grid version? The first looks better on desktop and the secons looks good on mobile device.
Thank you!
Hey schnippel!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
#top .avia-layerslider .ls-nav-prev, #top .avia-layerslider .ls-nav-next { z-index: 999; }
Cheers!
Yigit
Hey!
You will need a bit of js to accomplish what you are looking for.
Please goto Appearance > Editor > functions.php
Add the following code at the bottom
// reveal on scroll
function reveal-onscroll(){
?>
<script>
$(document).scroll(function() {
var y = $(this).scrollTop(),
revealOnScroll = $('.reveal-onscroll');
if (y > 600) {
revealOnScroll.fadeIn(1000);
} else {
revealOnScroll.fadeOut(1000);
}
});
</script>
<?php
}
add_action('wp_head', 'reveal-onscroll');
The above code make the button visible after user scroll 600px. adjust this number as you like.
Then add class “reveal-onscroll” to your current button
Example : <a class "reveal-onscroll button-styles" href="#"> Button </a>
Cheers!
Vinay
Hey DROR!
Can you please try adding following code to Quick CSS
#top .form-row .input-checkbox { position: static; }
Cheers!
Yigit
Hi, once you login, go to PORTFOLIO, and the portfolio item is ‘Camp Beaumont’ – it’s the image with a desktop/tablet/phone
Thanks!
Hey sberendss!
try to add an !important to your code:
.html_header_transparency #top .avia-builder-el-0 .container, .html_header_transparency #top .avia-builder-el-0 .slideshow_inner_caption {
padding-top: 0px !important;
}
Best regards,
Andy
Hi,
I had originally posted the following question:
I am looking for code to make a menu that is a hybrid of header option 3 and 5. Basically, my header contains 2 logos – one on the left and the other on the right, and I would like for the navigation tabs to be in the centre, below the logos as in the 5th Menu and Logo Position option.
I received a response to add the following code and it worked:
.html_header_top.html_logo_center .logo {
left: 0;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
I am now working on another project and want to add the second logo on the right side. How and where do i add this? I have so far added the left side logo in the theme options section but do not know where to add the second one.
Thanks.
Regards,
Geo
Hey Groeier!!
actually it’s a WordPress’ issue and I think we need to wait for a new WordPress version. Refer to: https://kriesi.at/support/topic/pagination-not-working-after-wordpress-4-4-1-and-enfold-3-4-7/#post-565212
Regards,
Andy
Hi Peter,
I proabably won’t be able to help much, but I have a similar problem and while one solution shown elsewhere says to add a SectionID to the color section and then add the following CSS in e.g. Quick CSS:
#sectionidname .container { width: 100%; }
it does work for me for the revolution slider i use but not for e.g. a fullwidth-button as shown in this example. Note that the background color i set in the color section stretches fullscreen.
Also, I found this but it doesn’t help me much since i use the enfold child theme without any modifications so far.
I thought our problems overlap and wanted to provide an example. Sorry for highjacking your query in case my additional info doesn’t solve your problem.
Cheers
Chris
EDIT: Thanks, also solves mine!
-
This reply was modified 10 years, 2 months ago by
hpexperten. Reason: remove server url / thx
Hi
My current site http://www.fotowalther.ch is created with Flashlight (non-responsive).
With WP4.4 there is some kind of responsiveness, however, on a mobile device you can barely read the menu.
I would like the menu to always stay on top of any page, displaying the main menu items, on hovering it should show a drop-down with the submenus. (Same function as currently in place, but on top and adapted for mobile devices).
No hamburger button!
I might switch to Enfold, provided there is a solution for the menu as described.
I would appreciate getting examples of responsive Enfold-sites with several submenus created without a hamburger button (aka side menu, navigation drawer)?
Is there a way to do it with Enfold at all?
Example:
Main menu: Home, Gallery, Cart, Links, Contact
Submenus:
Gallery/Landscape
Gallery/Landscape/USA
Gallery/Landscape/UK
Gallery/Landscape/Canada
Gallery/Portraits
Gallery/Animals
etc.
Thanks,
Bruno
Hi!
I don’t really get your last post. What are you talking about?
By the way I can’t find the code I have given you in your Quick CSS field. Where is it? please paste it inside and test it on your device. Play around with different values until it fits for you.
Regards,
Andy
Hello,
I have an pagination problem on this site:
http://www.writtenbysue.nl/
On the homepage you can see a blog with pagination but the pagination doesn’t work.
I’ve updates to the latest version of WP and Enfold.
I can see a lot of topics with the same problem but nowhere I can find a solution within a child theme.
I would like to change the theme trough child theme.
Can you give me advise?
Greets Jeen
Hi Elliot,
That bit of CSS you provided does not work.
I have provided a link to 2 screenshots:
1. is what I currently have.
2. is what I want to achieve.
I also provided a link to the page in my previous post.
So essentially what I want is 5 icons used as tab titles, centered on the page and spaced apart.
This CSS achieves it:
.contact-tabs .tab_titles {
position: relative;
width: 1315px !important;
clear: both;
float: none;
margin: 0 auto;
}
.js_active .top_tab .tab {
padding: 12px 70px 0px 70px;
}
But the second bit also affects other Tab elements I have used elsewhere on the site. I only want it to affect the one used on this page.
Thank you.
On a certain page, I have hidden the header (logo+navigation etc) via page settings. But now, the page has a top padding of 116 px (probably the height of the regular header).
I see the following code in Chrome Inspector:
media="all"
.html_header_transparency #top .avia-builder-el-0 .container, .html_header_transparency #top .avia-builder-el-0 .slideshow_inner_caption {
padding-top: 116px;
}
When I change “116px” into “1px” in Chrome Inspector, it looks good, but when I paste this CSS into Enfold Quick CSS, the 11p padding still exists.
Can you help me to get rid of this padding?
Thanks!
Hi it working
that was a special kind a stupid :p
many tnx!
Topic can be closed
Hi!
it’s still showing on the bottom off the pages.
Another solution? :)
Style.css
/*Remove big automated image on portfoliopage*/
.single-portfolio .page-thumb {
display: none;
}
*/ Social media verwijderen op PAGES */
.page #custom_share_box {
display: none;
}
*/ Achtergrondkleur heading */
.av-special-heading-tag {
height: 100px;
position: relative;
top: 40px;
}
.av-special-heading-tag span {
background: rgba(255, 162, 29, 0.5) none repeat scroll 0 0;
border-radius: 15px;
padding: 10px 20px;
}
/* Menu Kleuren */
/* Home */
li#menu-item-11 a {
background-color: #545454!important;
}
/* IT Diensten */
li#menu-item-249 a {
background-color: #2d5c88!important;
}
/* Telefonie */
li#menu-item-261 a {
background-color: #dd6666!important;
}
/* Mobiel */
li#menu-item-263 a {
background-color: #61afd3!important;
}
/* Internet */
li#menu-item-262 a {
background-color: #00ddb1!important;
}
/* Veiligheid */
li#menu-item-353 a {
background-color: #816084!important;
}
/* Website */
li#menu-item-477 a {
background-color: #ffa21d!important;
}
/* Nieuws */
li#menu-item-274 a {
background-color: #545454!important;
}
/* Portfolio */
li#menu-item-511 a {
background-color: #545454!important;
}
/* Contact */
li#menu-item-266 a {
background-color: #545454!important;
}
functions.php
add_action('ava_after_content', 'avia_add_social_toolbars', 10, 2);
function avia_add_social_toolbars($id = "", $context = "")
{
if($context == "single-portfolio" || $context == "product")
avia_social_share_links();
}
add_filter('avf_template_builder_content', 'avia_add_social_toolbar_template_builder', 10, 1);
function avia_add_social_toolbar_template_builder($content = "")
{
$content .= '<div id="custom_share_box" class="avia-section main_color container_wrap"><div class="container">';
$content .= avia_social_share_links(array(), '', '', false);
$content .= '</div>';
return $content;
}
-
This reply was modified 10 years, 2 months ago by
c3computers.
Hey hofpils!
du könntest erstmal das hier machen: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
und dann könntest du deine Elemente so anordnen im Layout mithilfe vom ALB wie du es für mobile möchtest. Diese mobile-only Elemente kannst du auf Desktop ausblenden lassen:
@media only screen and (min-width: 736px) {
.mobile-only {
display: none;
}}
Sag mir bescheid, wenn du soweit bist und weiterhin Hilfe damit benötigst.
Gruß,
Andy
Hi!
Use the following:
#top #header .av-main-nav li.current-menu-item a {
background: red;
}
#top #header .av-main-nav li.current-menu-item a .avia-menu-fx{
background: blue;
}
The first code will change the background of the link and the second one will change the color of the indicator.
Regards,
Josue
Hi
ive tryed this:
https://kriesi.at/support/topic/share-icons-on-pages-and-portfolio-items/#post-260646
But the socialbar is shown on top of the page, and it also show in normale pages (and destroys my menu).
I only want it to show on single porfolio items (at the botom)
tnx! :)