Hey kls1138!
If you are referring to this kind of blog:

That would be any square size, 180×180 for example.
Cheers!
Josue
Hi!
1.) This is a sample of a custom background use on the demo. The file size is 181kb. http://kriesi.at/themes/enfold/files/2013/04/floor.jpg
2.) Where is this happening? Can you please give us a link to the actual page with the fullwidth image?
Regards,
Ismael
Hey JaredBurnett!
Please edit shortcode.js, find this code on line 673:
//trigger displaying of thumbnails
gallery.on('avia_start_animation', function()
{
images.each(function(i)
{
var image = $(this);
setTimeout(function(){ image.addClass('avia_start_animation') }, (i * 110));
});
});
Replace it with:
//trigger displaying of thumbnails
gallery.on('avia_start_animation', function()
{
images.each(function(i)
{
var image = $(this);
setTimeout(function(){ image.addClass('avia_start_animation') }, (i * 110));
});
}).trigger('avia_start_animation');
Remove browser cache then reload the page a few times.
Regards,
Ismael
Hey sky19er!
Have you tried with the Masonry Gallery element?
Best regards,
Josue
Great answer. I’ve always wondered this and was providing the answers in the copy above to a graphic designer I’m working with. There’s not much info out there, and I felt like I was close, but you can see how this topic can be very confusing. Two things:
http://purerideusa.com/
1. As far as file size, is there any “sweet spot” or “stay below” rule of thumb that we should follow regarding performance? The image we’re currently using is 607KB. Is that ok or is it too large?
2. The background-size:cover css3 attribute does stretch the image to full width but it doesn’t stretch to full height. If you check our site on an iPhone 5 or newer (I’d imagine its the same on any mobile device where the vertical dimensions are larger than 1192), you’ll see that the image stops at 1192px and the rest of the screen is filled with black. Is this a situation where we need to check the chart I created and make sure the vertical dimensions of our bg are large enough pixel-wise to to fill the screen since the css doesn’t do this?
Thanks,
Hi mrlreynolds!
Firstly you should edit your logo. You can add following code to Quick CSS in Enfold theme options under Styling tab to achieve what you would like but logo image will be stretched
@media only screen and (min-width: 989px) { .logo, .logo a, .logo a img { width: 285px!important; height: 40px!important; }}
@media only screen and (max-width: 480px) { .responsive .mobile_slide_out .logo { margin-bottom: 30px; }
#advanced_menu_toggle { top: 75%; } }
Cheers!
Yigit
Hi!
Can you post a screenshot and show where exactly you would like to add a background image? You can use Color Section element in Layout Elements in Avia Layout Builder or you can set a background image to content
Best regards,
Yigit
Hey!
It seems like some of the CSS codes are not being applied for your 3rd and 4th question. Please try adding it to custom.css file inside Enfold/css folder and if that still does not work, you can try adding !important to force it as following
#top .main_menu .menu>li:last-child>a {
padding-right: 15px!important; }
.header_color .main_menu ul:first-child > li > a { color: white!important; }
.header_color .main_menu ul:first-child > li > a:hover { color: black!important; }
You should edit your logo image. It displays fullsize of your logo.
Do you mind creating a temporary admin login and post it here privately so i can do it for you?
Best regards,
Yigit
This reply has been marked as private.
Hey there, please click on the link below to view my draft website. Noticed on Home Slide #5, the image appears with this grey area. It happens now and then and I end up having to re-upload the image. What’s causing this? The image appears fine in the Media Library. After re-up the image, the grey area displays again now and then also. Let me know. Thanks.
Hello Yigit, thanks for your help so far.
1) The logo looks resized (isnʻt retaining the image quality) – is it being sized down and up again? The sizing itself is perfect, thank you!
2) Can you tell me where in header.php to place the jumping turtle image so it appears in the right-hand portion of the header above the bowl? The image is turtle.jpg and is 190w x 117h.
3) For the menu – how do I change the text color to white – black when rolled over?
4) For the menu – notice how the boxes are too small? About Us the s is right up against the line for the box. How do we create more horizontal padding?
Many thanks!
Drew
Many thanks, I’ve published my image in the first column.
But theres is now all the pages in column 2 and Categories in column 3. I don’t want theses!
De nada, que bueno que te haya podido ayudar :)
Saludos,
Josue
Excelente Josué, parece funcionar perfectamente, muchas gracias!!
Saludos
José
Bonjour!
1) In WordPress dashboard please go to Appearance > Widget and place any of the widgets you would like to display in any of Footer columns
2) Would you like to add images to widget areas in Footer? If so, you can add Text widget and add your image using HTML http://www.w3schools.com/tags/tag_img.asp
Best regards,
Yigit
Hola,
Prueba con esto, ponlo en el contenido del Page mientras estas en la pestaña Texto:
<style>html, body{ overflow-y: hidden !important; }</style>
Saludos,
Josue
Hey!
Glad you figured out the issue! Let us know if you have any other issues or questions
Cheers!
Yigit
Gracias Josué, pero no parece funcionar ninguna de las dos alternativas.
Esta página usa el Blank Template, es posible hacer algo a nivel de CSS o PHP de dicha página, de modo que todas las páginas que hereden este template tengan esta propiedad seteada de esta manera?
Gracias de nuevo
Saludos
José
Hey!
Can you elaborate? If i understood you clearly, you are going to need to modify theme files to achieve that.
Cheers!
Yigit
Bonjour,
Please excuse my beginner question :
1 – How edit the footer as there is not a list of pages in ?
2 – I would like to insert an image in this footer, how?
Is there any way at all to use the background image with the full width, stretched version of the layout vs the boxed version?
This reply has been marked as private.
Hi Devin,
Unfortunately that did not work.
I changed the following code on line 920 & 921:
add_action( 'woocommerce_before_single_product_summary', 'avia_add_summary_div', 25);
add_action( 'woocommerce_after_single_product_summary', 'avia_close_div', 3);
I changed it to:
remove_action( 'woocommerce_before_single_product_summary', 'avia_add_summary_div', 25);
remove_action( 'woocommerce_after_single_product_summary', 'avia_close_div', 3);
I then replaced the config.php file in BOTH the main theme and my child theme config-woocommerce folders. However, nothing changed on the website. I think that just removes an EXTRA Div surrounding them.
I’m more than happy to do my own digging, but I can’t find ANY decent documentation on woocommerce and how to use the ‘hooks’.
Any help you can give would be much appreciated.
You can see the incorrect position of the Cart on this page:
http://arabellafoods.co.uk/shop/nuts/peanuts-roasted/
Also in this image:

Hi glen!
Our theme uses the background-size:cover css3 attribute ( http://www.css3.info/preview/background-size/ ) to stretch the image to fullwidth. In theory you can use any image size (i.e. 100x100px or 1000x1000px or 10000x10000px) and the browser will always stretch the image to 100% of the container width. The resolution will just determine how the images will look like on retina displays or displays with high resolutions in general. If you use a low resolution with i.e. 1280x720px the retina displays will show the bg image blurry but a standard screen will display it perfectly fine. That said there’s no general answer for your question because it depends on the image and it depends on the “message” you want to send with the image. If it’s just a bg image which should underline your text you don’t need to use a high res image and even if it displays a bit blurry no user will notice it. However if the bg image is your message (i.e. with hardcoded text, etc.) then use a high resolution image with 2560px width.
Cheers!
Peter
Hi!
The reason why the hover effect doesn’t work is that Kriesi checks the height of the image with following code in enfold/js/avia.js
if(current.outerHeight() > 100)
and if the height is smaller than 100px the function won’t apply the hover effect because there’s not enough space for the round icon. You can try to modify the function and replace 100 with i.e. 80 but personally I recommend to upload a bigger version of the image which has a height of at least 101px.
Regards,
Peter
Hey, i have a problem with my first created slide at LayerSlide in EnfoldTheme.
I did all the necessary configurations at the “layer styles” with the LayerSlider WP. Example image below:
http://www.taodesignlab.com.br/eco/help.png
But, on the website, all images are with +70px in “left” property
Ex. .ls-s-1 img {… left:70px}
http://www.taodesignlab.com.br/eco/
How do i fix that?
What size image is recommended for the blog posts? What is the maximum size image that can be used without resizing? The theme keeps resizing the images I set as featured images.
Is there a way to control the thumbnail that is displayed in the single author small blog style? As it stands, the thumbnail is showing images that i don’t have control over, so they’re getting cutoff in unacceptable ways. I have attempted to crop the image and set the thumbnail size in the wordpress media library, but the theme doesn’t seem to be picking up on it.
Do you all have any documentation that helps users understand how to work with images within the theme?
Thanks!!
Is there any method of auto-cropping available, to create galleries where thumbnails are all the same size, like this, for example? http://cbdmh.org/summer-fieldwork-2013/
Thanks!
Hey Daniel!
Try adding this code to the Quick CSS:
.grid-image.avia-hover-fx {
border-radius: 100px;
overflow: hidden;
}
Cheers!
Josue