Hey ppi37!
If you are trying to style cf7 form similar to enfold form please try the following https://kriesi.at/support/topic/contact-form-7-enfold-contact-form-identical-styling/#post-568434
Best regards,
Vinay Kashyap
Hi there,
I have a color section with video background (self hosted mp4) on my homepage. In the media library I put the corresponding ogv and webm too.
It works fine on desktops and laptops but when I tested it with a brand new iPad Pro, I can’t see the video.
On the same page I have a video player which is working correctly with self hosted mp4, ogv, webm.
I was thinking that maybe the self hosted mp4 was the problem so I created a test page with 5 different video background sections: youtube link, vimeo link and the self hosted mp4, ogv, webm. Still nothing.
Please note that the mp4 in the test page was downloaded from youtube for a correct encoding, as suggested in a post here.
Can you please tell me if there is a way to show the video background in that color section?
Or if I can use a different element (Fullwidth Easy Slider, Advanced Layer Slider) with video background as an alternative?
Thanks!
Hi!
Please use the logo center menu below settings in enfold options and the below css to achieve the look.
Adjust max width and margin right value to suit your needs.
NOTE: the below css works on default theme without any custom code please remove any styles applied earlier to see it in action. if you still have issue please create a temporary user with ‘administrator’ role and share in private content with permission to deactivate all plugins and add custom code if necessary to help you resolve this issue.
In the below code nth-child(X) should be half of the number of menus for example if you have 4 menus it should be 3 or if you have 6 menus it should be 3.
/*centered menu*/
.av-main-nav li:nth-child(3) {
margin-right:350px;
}
.av-logo-container {
position:absolute;
}
#header_main_alternate {
margin-top: -100px;
z-index:9;
}
.logo {
z-index:9999!important;
max-width:200px;
}
Best regards,
Vinay Kashyap
Hi guys! I had a question that I haven’t been able to find the answer to…
We have a client that we mocked up a service page for… she wanted to have a menu underneath the main header that ‘sticks’ and offers anchor-style navigation to the page. We want the links to jump to the correct section, etc etc. I placed the anchor links above the “header” of each section, but on desktop… they are painfully incorrect. On mobile, they look fabulous and link to the correct area!
Tested with Firefox and Chrome.
Help? Thoughts? Suggestions? What am I missing?
I just updated to 3.5.1 and the problem came back.
What I did in the past worked until I upgrated to 3.5:
Child theme/css/shortcodes.css and from the file I deleted the code (see above).
If you check now, you will see the problem in responsive mode.
Check any page from the teachers (http://www.koelner-musikakademie.de/dozenten).
The tabs should be next to each other and not on top of each other.
I really don´t get it…
Thanks
Asterios
I’ve been looking through old support posts trying to find the right answer to how I can better control the gutter between columns. I have two rows – the first is a 1/5-4/5 and the second row is a 1/5-2/5-2/5. I would like the 1/5 column to not have any margin to the left or right in both the first and second rows. In the second row I want the 2/5 columns to fully occupy the width of the page (in the same way the slider at the top does (please see attached screen shot).
I’ve done over 100 child theme customizations between the CSS and the footer.php, but even when I feel I get close with this it eludes me, so any help is appreciated.
Thank you!
-
This topic was modified 10 years ago by
lzevon.
Hi Rikard,
I tried the cache clearing and also different Browsers (Firefox and Chrome) – without any change.
Could the problem occur because I have two different WordPress installations in the same ftp-Location? (So there is a WordPress_04 and a WordPress_05 folder in the same folder).
Anyways I created a temporary admin account for you (see private content).
Thank you very much for your help.
Regards,
Christopher
Hi,
you can find my website and login details in the private content.
On the Website i use a logo on the left site at the Navigation. How can i align the logo in the middle of the navigation. If i use
margin-top in css it is possible to align the logo in the middle of the navigation. But when i scroll deeper, the navigation skrinks an the magrin-top is to much. Is there a possibility to align the logo in the center on both naviagtions (skrinked and normal)
I look forward to hear from you
Chris
As I said in topic title I need an option to add a tracking code to a single page of my website (“thank you” page fropm contact form).
Hey!
Got my Nokia Phone 2 days ago and was able to do a few tests. It did take a while but surprisingly there might a super simple fix. Just wanted to ask you if you can check for me, since it works perfectly fine on my lumia and also does not affect my iOS phones.
In shortcodes.css in line 248 change
.avia_mobile #top .av-parallax{position: fixed; z-index: -10;}
to
.avia_mobile #top .av-parallax{position: absolute; z-index: -10;}
This actually solves all the fixed bg problems for me. would be glad if you could try this. (please try without the modification javascript added earlier and also make sure to clear your browser cache first)
Cheers!
Kriesi
Hallo Supportteam!
.breadcrumb {
width: 35%;
top: 13px !important;
}
Die o.g. Lösung funktioniert am Bildschirm. Sie ist aber leider nicht responsive – siehe
Gibt es hier noch eine bessere Lösung?
Besten Dank für Eure Hilfe!
Regards
PEter
Hi Yigit, thanks! I did not notice that when you insert the logo, it automatically resizes the picture instead of leaving the original size.
I was wondering whether I could make the menu appear on a red background ( #dd0031) – in which case, I could get rid of the red bar in the header and make the whole thing appear united (with the illusion of the menu integrated in the header). Is it possible to achieve? (the example I am looking to reproduct in a simpler way is http://mecenat.theatrechampselysees.fr/wp-content/uploads/2016/03/00-TCE2017_DESKTOP_HEADER.jpg )
Hi vnfan!
You can use shortcode in phone info field
You can enable debugging mode to see shortcodes you have created in pages using Advanced Layout Builder – http://kriesi.at/documentation/enfold/enable-advanced-layout-builder-debug/
Or, You can switch to Default Editor and click on Magic Wand to see full list of shortcodes http://i.imgur.com/n4KXkdm.jpg
then you can create any of them and copy/paste shortcode into any other content element or into text widget.
To have your number click-to-call, please see – https://kriesi.at/support/topic/phone-number-click-to-call/#post-452509
Cheers!
Yigit
Hey!
Please remove the code you posted here – https://kriesi.at/support/topic/use-another-font-for-all-sections-of-the-website/#post-601441. Helvetica is not a Google font so it would not work.
Best regards,
Yigit
Hi there,
I am trying to create a slider but each picture has its own height, for that reason content below slideshow moves depending on picture height. I can block slider height to 420px for exemple setting the ul container max-height property.
How can I make the height adapt automatically to the screen width ? In desktop having max-height: 420px makes sense, but in a mobile screen it doesn’t.
Best regards,
Hi Philippe!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
.html_header_top.html_header_topbar_active.html_header_sticky.html_large #top #main {
padding-top: 167px !important;
}
Best regards,
Yigit
Hey!
You inserted your logo in smaller size, i edited it and inserted in fullsize and then added following code to bottom of Quick CSS field in Enfold theme options under General Styling tab
.html_header_top.html_logo_center .logo {
left: 0;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
.container.av-logo-container {
max-width: 100%!important;
width: 100%!important;
padding: 0!important;
}
Width is not enough to fill the whole container. It would be better if you uploaded your banner image in at least 1920px in width.
I created a private testing page (link in private content field) and your icons show up fine on my end. Please flush browser cache and refresh your page a few times
Cheers!
Yigit
Hey!
Thanks for getting back to us and very sorry for the delay.
I have changed back all the menu items to display as buttons with color. Also if you go to the Quick CSS section under the General Styling tab in the theme options, I added the following code:
#top #header .av-main-nav > li {
padding-left: 15px;
}
Adjust the number to adjust the space between the menu items if you wish.
Cheers!
Jordan
Mine stopped working today also, in Firefox, but just now in my quick testing, it still seems to be working in Chrome and IE.
Hello there,
Is there a way to set background images in section as “Fixed” on desktop while set as “Scrolling” on Mobile?
The reason is that some devices (probably due to the images dimensions) won’t show up the “Fixed background images” on Mobile. Feel free to check the sent link on Desktop vs mobile. On mobile (Iphone) images just won’t show up.
Let me know if you can suggest any better way to have the desired result to have images properly showing up on mobile.
Thanks
JD
It’s all ok on PC and Tablet !!
But no menu on smartphone :-(
All my quick CSS :
.av-main-nav>li>a {
letter-spacing: 1px;
}
.entry-content-wrapper h1{
letter-spacing: 20px !important;
}
.entry-content-wrapper h2{
letter-spacing: 16px !important;
}
.avia_desktop.avia_transform3d .av-masonry-entry.av-masonry-item-loaded .av-inner-masonry {
-webkit-animation: none;
animation: none;
}
.avia_desktop .av-hover-overlay-active .av-masonry-image-container {
opacity: 1;
}
.av-masonry-image-container:hover { transform: none !important; }
.container.av-logo-container {
display: none!important;
}
.html_header_top.html_header_sticky #top #wrap_all #main {
padding-top: 50px !important;
}
#header {
height: 50px;
}
Thanks but this just moved the logo down. The logo as you can see in the image linked is at the top and would not need to be moved down and the background color (dark green) is shorter. Right now the site is on a local development server or I would send you a link.
Hi sublime5o!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
.logo { top: 20px; }
If that does not help, please post the link to your website
Best regards,
Yigit
Guten Tag!
Ist es möglich diese Image-Hotspot box nur bis zu hälfte (70%) der Breite zu machen ( Die ganze hälfte sollte von dem Bilde ausgefüllt werden ) .
Und die restlichen 30 % der hälfte der Breite soll mit einer Icon- List beinhaltet werden. Ich habe es bisher probiert mit eine Parent-Farbsektion und in dieser 2 Spalten, die eine 70 und die andere 30 . In der mit der 70 % (Image-Hotspot) wird das Bild zwar angezeigt, aber nicht in den vollen maßen ausgefüllt. Wie könnte man das lösen?
Webseite: http://christoph-fuchshofer.com/
Hello I want to add a custom text right after the social icons. My social icons are positioned on the right of the very top header.
I tested this:
add_action('avia_meta_header', 'avia_add_forms_on_header');
function avia_add_forms_on_header() { echo "<div>mytext</div>"; }
My text appears after the secondary menu in the header on the left. I want it after the social icons positioned on the right.
Thank you for helping me.
Hello guys,
I’m using Enfold with Lato google font and I’d like to add latin-extended subset.
I found similar topic ( https://kriesi.at/support/topic/google-fotns-with-extended-latin-subset/ ) and I tried applying the same solution, but no luck.
add_filter( 'avf_google_heading_font', 'avia_add_heading_font');
function avia_add_heading_font($fonts)
{
$fonts['Lato'] = 'Lato:400,300,300italic,400italic,700,900:latin,latin-ext';
return $fonts;
}
add_filter( 'avf_google_content_font', 'avia_add_content_font');
function avia_add_content_font($fonts)
{
$fonts['Lato'] = 'Lato:400,300,300italic,400italic,700,900:latin,latin-ext';
return $fonts;
}
I added this chunk to child-theme’s function.php, but nothing happened. Then I moved it to enfold function.php right after
$avia_config['color_sets'] = array(
'header_color' => 'Logo Area',
'main_color' => 'Main Content',
'alternate_color' => 'Alternate Content',
'footer_color' => 'Footer',
'socket_color' => 'Socket'
);
and the app was broken – I got the following error:
Fatal error: Cannot redeclare avia_add_heading_font() (previously declared in /home/acirs/public_html/content/themes/ACI/functions.php:9) in /home/acirs/public_html/content/themes/enfold/functions.php on line 54
What am I doing wrong? :)
-
This topic was modified 10 years ago by
borkosavic.
Hi Ismael,
With all due respect, the client wants these specific translation services in their main nav menu.
In fact I agree with the client: you should be able to place links to practically anywhere in the website you want in order to offer a visitor the best possible navigation experience. And you should be able to see where you were linked to when you click a certain link. Now it is hidden by the sticky header.
Custom work is not an option.
If there is no solution for this, you can flag this topic as solved.
Regards,
Monique
Hi Ismael,
I checked in on a tablet (landscape screen) and also on a various devices (pc, laptop) with screensizes 1024 x 768 px and 1024 x 600 px, and it shows everywhere where the screen height is under 786 px.
I think your solution means to show the top header already for all screensizes up to and inclusive 1024 px width? However that cannot be the intention of using a left sidebar layout… Then it would be better to go for the ‘normal’ header on top. But that is not what the client wants.
Therefore your idea is not a solution to this problem I’m afraid.
Can we solve this issue for the left sidebar layout or not?
Regards,
Monique