This an addition to the following thread:
I would like to use this to create a header similar to that of amazon. Have the logo on the left, a long search menu and then the cart all on the main menu. Sub menu below it.
Yigit, could you please help me with this other post too?
I need to understand how to do use it.
thank you so much!
I followed the steps laid out above and created a new API key. Still getting the same broken element on my live site.
Conversely, you can see the staging site is displaying the map correctly, here: http://www.caninephd.imperialwerewolfoctopus.com/contact-us/
Granted, the staging version is using an older version of Enfold as its parent theme.
Hi,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
/* iPad Landscape */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
.responsive #top #wrap_all .grid-sort-container .grid-entry {
width: 100%;
margin-bottom: 50px;
}
}
Best regards,
Vinay
I’ll have my team help me with it and reach out if it didn’t help. Pls don’t close the topic for now. I’ll let you know how it went.
Thanks
Hey!
Please edit your pages where you would like to apply these changes and then add following code inside Code Block element
<style>
@media only screen and (max-width: 767px) {
.av-submenu-container {
position: fixed!important;
top: 111px!important;
}
#main {
margin-top: 103px!important;
}}
</style>
Cheers!
Yigit
Hi Robi,
I have added this code in Quick CSS:
@media only screen and (max-width: 1024px) {
.responsive #top #wrap_all .grid-sort-container .grid-entry {
margin-bottom: 50px;
}
}
This should fix the issue. Let us know if it works on your end also. :)
Best regards,
Nikko
I have created a fresh wp install with the latest enfold template and demo content. The image shift problem is still there. Also, for mobile, the color section background image will not display “top center”. If you compare looking at phone vs laptop/desktop you will see there is a difference in how the background image is displayed. I thought this issue was corrected at one point, with the template. Is there a fix?
-
This reply was modified 9 years, 5 months ago by
lssu.
Hi, first i would like to say, I love Enfold. However, I am having several issues with the way my site is displayed on mobile. I’ve read all the threads on this, and tried several codes, however, nothing has worked.
Here’s what I would like to achieve, follow by an example of what I would like the end result to look like:
1. Easy slider to take up the whole page on mobile, as it does on desktop. Currently, it’s full width, but only on the top portion of the screen on mobile.
2. Mobile menu buttons to display in a way that it is visible (right now it is transparent, and I can’t seem to change it) – also I would like it not to appear on the top of the main image when the menu button is selected, as it is currently doing.
3. Easy access CTA “email” and “call” buttons on the bottom of the viewing screen.
All of the above examples are viewable on this site in mobile view; nc.fit.
Here is my site to show the problems I am having in mobile view: http://8a0.148.myftpupload.com/
Please advise. Thank you.
Hey snitt,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
.responsive .av-hotspot-fallback-tooltip {
display: block;
}
Then go to enfold/config-templatebuilder/avia-shortcodes/image_hotspots.php file and find
function add_fallback_tooltip($hotspot, $counter)
{
$content = $hotspot['content'];
if(empty($content)) return;
$output = "";
$output .= "<div class='av-hotspot-fallback-tooltip'>";
$output .= "<div class='av-hotspot-fallback-tooltip-count'>";
$output .= $counter;
$output .= "<div class='avia-arrow'></div></div>";
$output .= "<div class='av-hotspot-fallback-tooltip-inner clearfix'>";
$output .= ShortcodeHelper::avia_apply_autop($content);
$output .= "</div>";
$output .= "</div>";
return $output;
}
and change it to
function add_fallback_tooltip($hotspot, $counter)
{
$content = $hotspot['content'];
$blank = strpos($link_target, '_blank') !== false ? ' target="_blank" ' : "";
$blank .= strpos($link_target, 'nofollow') !== false ? ' rel="nofollow" ' : "";
$link = aviaHelper::get_url($link, false);
$tags = array("a href={$link} {$blank}", 'a');
if(empty($content)) return;
$output = "";
$output .= "<div class='av-hotspot-fallback-tooltip'>";
$output .= "<div class='av-hotspot-fallback-tooltip-count'>";
$output .= $counter;
$output .= "<div class='avia-arrow'></div></div>";
$output .= "<div class='av-hotspot-fallback-tooltip-inner clearfix'>";
$output .= "<".$tags[0].">";
$output .= ShortcodeHelper::avia_apply_autop($content);
$output .= "</".$tags[1].">";
$output .= "</div>";
$output .= "</div>";
return $output;
}
Best regards,
Yigit
I didn’t figure it out. This has been the issue from the very beginning. The update has started, but the download from Amazon wasn’t allowed. Check this topic – https://kriesi.at/support/topic/theme-update-to-version-3-8-error/ – to see the error message (it’s private for moderators)
I want the 1px gap border.
Look at this screenshot:
http://www.zeppelinstudio.it/NOAH16/masonry.png
Notice that the left border of the photo “FEEL YOURSELF” is bigger than the others and the source image hasn’t border. Then there isn’t bottom border under the photo “BE” and also others…
If i set in the backend “no space between items” the previus border too big that i mentioned above remains.
I’m using Chrome but i tried also with Firefox and Safari.
The flag is near search icon but when i load the page before it goes on top page margin and after 1/2 seconds goes back near search icon. I want to avoid this movement. I think it’a a css problem.
Thanks
Hi boehmmedia!
If you are using a child theme – http://kriesi.at/documentation/enfold/using-a-child-theme/ which we would recommend in order to avoid applying the same changes each time you update the theme, please copy unmodified enfold/framework/php/class-form-generator.php file and paste it inside enfold-child folder and apply your changes and find following line at the top
<?php if ( ! defined( 'AVIA_FW' ) ) exit( 'No direct script access allowed' );
and change it to
<?php
and then add following code to Functins.php file of your child theme
require( 'class-form-generator.php' );
Then open class-form-generator.php file in your child theme and find
echo 'jQuery(document).ready(function(){ jQuery(".avia_datepicker").datepicker({
and add following code right below that line
beforeShowDay: function(date) {
var day = date.getDay();
return [(day != 0)];
},
Cheers!
Yigit
Hey Bjdiving,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
.av-masonry-image-container:before {
content: ' ';
position: absolute;
width: 100%;
height: 100%;
top:0;
left:0;
background: rgba(0,0,0,.6);
opacity: 0;
transition: all 1s;
-webkit-transition: all 1s;
z-index: 200;
}
.av-masonry-image-container:hover:before {
opacity: 1;
}
Best regards,
Vinay
Hi,
My customer wants a fullscreen slider with fullscreen images. I uploaded images (format 5184 × 3456). In the settings of the slider all images use alignment bottom-center and no-scaling but parts of the image disappear. For example slider 2 the top of the image (roof of the house) disappears and slider 4 the ceiling of the room disappears.
What is wrong because i thought it is a responsive element so all images are fullscreen no matter what screen size.
THX Freek
Hi Guys
Sorry to ask because this has probably been answered a million times. However I cannot find the correct CSS.
How can I reduce the height of the mobile header on this site? It’s much higher on the Mobile screen than the Tablet/Desktop screen which is set to 60px in Theme Options > Header
http://web-lounge.co.uk/
Thanks so much.
CJ
Hello,
i’m using enfold theme with a lot of project and i think it’a great theme.
I’m developing a new site but i have some issues:
1 – there is a problem with masonry gallery setting 1px gap border. Look at this page: http://www.zeppelinstudio.it/NOAH16/live-your-hair/
The border isn’t always visible and sometimes it,s too big, like 2px. I tried to set images without border but the ones that was too big remains.
2 – I added manually in “helper-main-menu.php” the wpml language selector because i wanted to put it after search icon.
I think there is a css problem because when i load or reload the page it goes to the top and after 2 second it goes inline with the menu. Can you help me please i can’t undertand why?
Thankyou so much in advance
Regards
Hi Ismael,
I added this to quick CSS to temporary fix the layout of the pages.
@media only screen and (max-width: 767px) {
#top .flex_column_table{
margin-top: 0px!important;
padding-top: 10px!important;
}
}
But it doesn’t fix the real problem. The setting margin-top: -400px isn’t working on mobile devices..
Hi there,
i’d like to add some clarification and another question here. I also want some text based buttons for prev / next portfolio items.
i added this code to my child-theme function.php
add_filter( 'avf_template_builder_content', 'enfold_customization_portfolio_next' );
function enfold_customization_portfolio_next( $content )
{
if ( is_singular( 'portfolio' ) )
{
$content .= '<div class = "oha-portfoliobuttons"><ul><li>';
$content .= get_previous_post_link( '%link' );
$content .= '</li><li>';
$content .= get_next_post_link('%link');
$content .= '</li></ul></div>';
return $content;
}
}
and it works as wanted on single portfolio pages
BUT
removes all content from other parts of the website.
The main menu is still there, but no other page is visible.
(this might be what lucasvrooij meant with “blank pages” here https://kriesi.at/support/topic/portfolio-nextprev-buttons-in-page/#post-512693 )
So maybe something in this
if ( is_singular( 'portfolio' ) )
is not properly working?
Best,
Philipp
Hi,
I’ve installed a YouTube widget plugin today and the video opens twice. I did find a solution on these forums though, but it’s cause a problem.
I used a thread I found here to modify the theme JS to take out the youtube bit.
https://kriesi.at/support/topic/lightbox-effect-and-youtube-channel/
And I wanted it in my child theme so I didn’t have to change it every time the theme updates so found a solution here:
This has caused a massive problem for me because when I now try and edit the widget it will not drop down any more. It’s like the expand widget click just isn’t registering.
If I put the modified JS in the parent theme everything is fine, but for some reason when it is in the child theme, with the change to the functions.php it’s like it forgets how to do it.
Going to clear my caches now, but I was wondering if anyone could help?
Thanks in advance.
EDIT – Clearing the caches doesn’t help, but there is a plugin option to embed the video in an iframe rather than have it pop-up in slideshow mode, so I’ve done that for now. At least it stops the double video problem.
-
This topic was modified 9 years, 5 months ago by
jonrouse. Reason: Additional notes
Hi,
since the older topic has been closed – https://kriesi.at/support/topic/theme-update-to-version-3-8-error/ – I’m following up with a new one. I’ve purchased a new license of Enfold on ThemeForest, but I can’t find a way to update the theme anyway. I’ve generated a new Themeforest API key, but I’m not allowed the theme anyway. Please help.
Thanks,
Milan
Hi Nikko,
thanks for the two parts.
1) IMAGESIZE
After some problems – a code of the child-theme function overwrote all changes – it works. I delete this code and it works (after reupload):
function ava_image_sizes() {
add_image_size('entry_with_sidebar', 845, 321, array('center', 'top'));
add_image_size('entry_without_sidebar', 845, 321, array('center', 'top'));
}
add_action( 'after_setup_theme', 'ava_image_sizes', 11 );
So the last things to this topic are:
a) How can I integrate the following line in my child-theme to protect in case of theme-updates? If I insert the whole array or parts of it in the function of the child theme, the website crashes.
$avia_config['imgSize']['entry_with_sidebar'] = array('width'=>1040, 'height'=>1040 , 'crop' => false); // big images for blog and page entries
b) How can I crop the images in the blog overview? The default is original size.
2) SINGLE POST IMAGE & LIGHTBOX
Doesn´t work. Your code snippet crashes the website….
Hi
I’ve tried to create a modal window with a contact form following this instrucctions https://kriesi.at/support/topic/lightbox-for-mailchimp-form/#post-582439
The problem is that magnificPopup function is not declared anywhere.
¿There are an alternative method?
Hi Andy,
When preparing the screenshots for you I remembered I created them before (in February last). Then when I checked again on the website, it looks different from February…
1) the screenshot what it looked like when I started this topic in February 2016: : http://translators.nl/print-screen-using-sticky-shrinking-header-and-tabs.jpg > first tab and title not readable.
2) the screenshot what it looks like now: http://translators.nl/print-screen-using-sticky-shrinking-header-and-tabs-new.jpg > all readable (although not as perfect as your screenshot).
I am so suprised!!!
Whatever happened (browsers have been changed?) it looks acceptable now. On my screen the first tab and title are a bit tight, but all can be seen and read.
I think there is no need for further investigation, so can you please flag this topic as closed?
Thanks a lot for all your help!
Regards,
Monique
Hey holznermartina,
Thank you for using Enfold.
Did you use an old database or is this a new installation? What is the version of the theme? Please try the solution in the following thread.
// https://kriesi.at/support/topic/php-7-content-section-error/#post-547605
Best regards,
Ismael
Hi Eric,
Sorry for the problems, I tried changing a portion of text in the area you pointed out and I got the same results unfortunately. The reason why this is happening is most likely because of open html markup. Markup is added by WordPress when you for instance add bold text using the editor. If that markup is not closed properly it will break the layout builder unfortunately. You can see all the content including markup if you select the text tab in the top right hand corner of the editor. I had a look but there is a lot of markup and finding the guilty markup is going to take a lot of time.
Possible ways around this problem; you could try copying all the the content from the text tab and paste it into the text tab of the default WordPress editor instead. Since you don’t utilise any of the special functionality of the builder I don’t see any point to using it for that page to be honest.
Otherwise you could try to use the builder instead; for instance use the Special Header element for headers and so on, you can achieve better looking pages this way. You could also try to copy all text from the front end to a new page without adding any markup from the editor and start over.
Best regards,
Rikard
Hi,
Please try the following in Quick CSS under Enfold–>General Styling:
.page-id-701 form {
margin-top: 0 !important;
}
Best regards,
Rikard
Hey marilusnm,
In Dashboard > LayerSlider WP click on the “Help” icon in the top right hand corner of your screen to see the documentation for the LayerSlider WP Plugin.
You can also try the following link:
https://support.kreaturamedia.com/docs/layersliderwp/documentation.html
Best regards,
Jordan