Hi,
What is the correct dimension for the featured blog post image?
Example of what I uploaded – http://1c5.964.myftpupload.com/wp-content/uploads/2012/01/equity-1.jpg
How it appears on the top of my blog post – http://1c5.964.myftpupload.com/2012/01/bccp-equity-by-design-6th-annual-dml-conference-in-los-angeles/
How it appears on the blog grid page – http://1c5.964.myftpupload.com/blog/blog-grid/
On the blog grid page, it is fine but on the top of my blog post, it is cut off.
Can you please provide some insight on what is the correct dimension of featured image on blog posts?
Thanks
The generated CSS in Enfold is unnecessarily specific. which makes it difficult to override styles. For example I have 1 instance of a Partner/Logo element where I need to set a specific bottom margin at specific breakpoint. However this is how the Enfold sets the bottom margin
.responsive #top #wrap_all .flex_column{}
but then one element is set with
.responsive #top #wrap_all .avia-content-slider-odd .slide-entry.slide-parity-even{}
Eliminating .responsive #top #wrap_all from both selectors would make it much easier to specifically override.
See: https://10up.github.io/Engineering-Best-Practices/css/#css-specificity
Hey comelen!
Add the following code to your custom CSS
@media only screen and (max-width: 767px) {
.responsive #scroll-top-link {
display: block !important;
}
}
let us know if that works
Best regards,
Basilis
HI,
How do I set up the scroll up button on the mobile?
when I scroll all the way down the page I would like to have a button which will take me to the top.
Also where can I set up the menu button to appear all time while I am scrolling down?
Thank you
I am trying to center a logo half way above my footer like this:
View post on imgur.com
I have used some code for the Quick CSS found in the support forum:
#footer {
background-image: url(http://http://xyz.comf/wp-content/uploads/2016/05/ASF_30AnnivLogo_color.png);
background-repeat: no-repeat;
background-position: 25% -25%;
}
#footer .container {
margin-top: 150px;
}
The image shows the bottom half in the footer, but the top half is cut off like this:
View post on imgur.com
How can I correct this? Or is there a better way to do this?
Thanks in advance.
Problem is solved. Comments in Settings-Discussion was allready enabled. screen options in the top right corner has the comments enabled. But i overlooked the setting at the bottom of the page where i also had to enable comments. Or the SQL table repair made this last option visable, i’m not sure.
Thanks Yigit and Rikard for somehow pointing me in the right direction!
Hi, sorry the pages weren’t visible; we’re building the site and I had deleted the slider images. Fixed now.
I figured out how to fix the vertical space between the caption text and the heading – our developer’s CSS for this had set the bottom margin for -20, and I found that setting the bottom for -68px gave me the reduced vertical space I wanted. But I can’t figure out how to fix the mobile responsiveness issue when creating the caption via Grid Row.
So here are the two versions:
Special Programs / Alchemy Award
Caption is flush right with the maximum container width.
Caption is done with Color Section / 1-1 column / text box. In the column settings, margin both top and bottom is -50px, padding is zero.
Caption is fully responsive to mobile. The text remains flush right, and the vertical space between the caption and the photo remains the same height.
Special Programs / Ghost Light Project
Caption is flush right with the edge of the viewing screen.
Caption is done with Grid Row and a Quick CSS code named fullwidthcaption, margin top: -30px, margin bottom -68px.
Caption is NOT fully responsive in mobile. The text remains flush right, but the vertical space between the caption and the photo gets larger so that it develops a big gap.
What I want ideally is the caption flush right with the edge of the viewing screen but no big vertical space between the caption and the photo when viewing in mobile. (If this doesn’t turn out to be possible, at least I have an acceptable nice middle ground with the Color Section / 1-1 column method!)
GOAL left side log, right side menu, phone and button.
When I tried to combine both my menus into one single menu in the top (sub menu) but when I do that it leaves my main menu area empty and it then populated it with every page I’ve ever had in a menu.
Can I have my top area (where my phone and button reside now) be my main navigation with this theme and also have my log up there? Or can I move my button and phone down to the main menu area.
Thanks a lot, Josue, that solution works just fine for me. Would you mind removing the image link from your post?
Please consider this topic closed!
My main concern is that in mobile view my navigation when opened it is not readable. It has a transparent background so it is hard to read. I’d like to be able to set a color background for mobile view ONLY while maintaining the current transparency for desktop viewing. I have tried adding a color in the enfold > general styling > logo area background but it makes my header white and I lose the visibility of the background image. Please help me keep my current set up while simply adding a background color to the mobile navigation.
Hello support!
So I placed a customer reviews / testimonials element inside my clients page, which made all elements beneath on the page constantly move up and down – depending on the size of the testimonial text.
So I changed this and set a fixed position by putting this code into the Quick CSS:
.avia-slider-testimonials .avia-testimonial-content {
height: 130px;
}
This works fine, however now when I look at the page on smartphones it cuts off some of the testimonial text. How can I make this work in responsive mode – so that the text is shown on desktop, tablets and smartphones and still retaining a fixed position that doesn’t cause the whole layout to jump up and down?
Thank you!
Hey HKlearning,
Please add following code to Quick CSS in Enfold theme options under General Styling tab
#top div .avia-gallery .avia-gallery-big {
border: none;
padding: 0;
}
Best regards,
Yigit
Hey KirinDesign,
“Your access to this site has been limited” and i am not able to view your site. Could you please disable IP restriction temporarily and let us know?
Also, to my understanding, you followed this steps – https://kriesi.at/support/topic/having-problems-after-updating-to-wordpress-4-5-please-read-this-first/, is that correct?
If so, please post temporary admin logins in private content field as well
Best regards,
Yigit
Is there any way, using functions in child theme, to make new rows in a table go to the top rather than the bottom of the table? We have a lengthy table that we add a few new items to each month, and want them at the top. Given there’s no drag and drop functionality in the tables, we have to click about a hundred times to move the rows up one at a time all the way through the table. To say the least, we’re frustrated and looking for some solution. Someone else recommended adding tinyMCE advance but it apparently doesn’t work anymore with the newest WP.
Hi,
I’m trying to customize the fullscreen slider. I tried to read other topic that deal with the same issue but i didn’t find any solution.
I’m asking if it’s possible to change the icons of the navigation arrows provided by the theme with other created by me?
Thanks for the support
Hello dear supportteam
this question is related to this topic:
Since hours i try to config the view of my categories but what ever i do ….nothing ever happens
1: Where / how can i define the number of columns i want my posts to be in in a category?
2: Why are there so many options regarding the blogmeta – but nothing changes of you change the settings?
I found this in another thread:
add_filter('avf_which_archive_output','avf_change_which_archive', 10, 2);
function avf_change_which_archive($output)
{
if(is_category())
{
$output = single_cat_title('',false);
}
return $output;
}
What are these numbers supposed to do?
add_filter(‘avf_which_archive_output’,’avf_change_which_archive’, 10, 2);
Shouldnt they define post-count (10) and number of columns (2)
I guess so…
But if i use this code in my functions.php …nothing changes…it stays 3-column
Please dont let me go crazy over that ;-)
Save me!
Kind regards
Ricarda
Hey!
This part of the code is not being applied
#top #header .avia_mega_div > .sub-menu {
padding: 5px;
}
Please try changing it to following one
#top #header .avia_mega_div > .sub-menu {
padding: 5px !important;
}
Please make sure that > sign is not converted to – http://i.imgur.com/IDXRZQ3.png in Quick CSS field.
Regards,
Yigit
Hi
did you actually try to edit the gallery in the new page Spanish about aqua marina?
http://mantravisual.com/aqua2/wp-admin/post.php?post=4716&action=edit&lang=es&admin_bar=1
if you do, got to the Masonery Gallery at the top of the page and try and edit an item
it STILL says No Items Found
thanks
Hi,
This is not really an Enfold-specific support question, but I’d like to ask it here to see if anyone (Enfold staff and customers alike) happens to know of a solution.
I use the custom.css of the Enfold theme to style almost everything about the website, including temporary landing pages. The issue is that my changes to this css file are completely ignored by the browsers of returning visitors. This means that any landing page I make, even in their very own visual style, is completely broken to them.
Colleagues complain to me about issues on the website, which I clearly recognise as being caused by local caching of the custom.css file. A simple CTRL+R fixes everything, but I can only ask those colleagues to try this, not all other visitors. I can’t possibly add a message to the top of the site to ask visitors to hit CTRL+R before continuing on the site.
Today I saw the website on the PC of another colleague. It had an issue that I immediately recognised as something I fixed in early November 2015, so the custom.css has apparently not been reloaded since then. This is, of course, a huge problem in countless cases!
So I am really REALLY desperate to know of a work-around to this problem. What do other people do? I’ve asked my hosting about this, I’ve asked on this forum in the past, I’ve tried several things (like adding something that versions the file so that every new save will give it a new name and trick the browsers to ‘think’ it is a new file and always download a fresh version), but so far I have not found any working solution.
Any advice would be very much appreciated!
Hi there
Since updating WordPress and Enfold theme, I am having major issues with the site displaying correctly.
The homepage menu, and sliders are not working. Below the sliders should be three columns, but one large image is displayed. There are more, but these are a few examples.
With initial installation came wpbakery visual composer, and that is the only plugin I cannot update. Please assist.
I have tried everything according to this article: https://kriesi.at/support/topic/having-problems-after-updating-to-wordpress-4-5-please-read-this-first/ however, I am still having these display issues. There were slight issues pre-updating WordPress, such as three columns displaying as one large image. Now there are more issues across the entire site.
The content of the site itself exists. The display seems to be the issue.
Thanks in advance,
Claire
Hi,
Please add following code to Quick CSS in Enfold theme options under General Styling tab
#top .av-subnav-menu > li ul ul {
left: 308px;
}
Please make sure that > sign is not converted to – http://i.imgur.com/IDXRZQ3.png in Quick CSS field.
Best regards,
Yigit
Hi,
That is a clean way as well but if you would like to adjust padding on that certain button, please add following code to Quick CSS
#your-custom-id .avia-button.avia-size-large { padding-top: 3px; padding-bottom: 2px; }
and then edit your color section element and give it a custom id (“your-custom-id” in example) – http://kriesi.at/documentation/enfold/wp-content/uploads/sites/2/2013/12/color-section-ID.png
Best regards,
Yigit
Hey bensondesign,
Please add following code to Quick CSS in Enfold theme options under General Styling tab
.avia_mega_div a {
height: 20px!important;
line-height: 20px!important;
}
#top #header .avia_mega_div > .sub-menu {
padding: 5px;
}
.avia_mega_div .avia-menu-text img {
position: relative;
top: 3px;
}
Please make sure that > sign is not converted to – http://i.imgur.com/IDXRZQ3.png in Quick CSS field.
Best regards,
Yigit
Hey!
Try adding this code to the Quick CSS:
.html_elegant-blog #top span.blog-categories.minor-meta {
position: absolute;
left: 0;
right: 0;
margin: 0 auto;
top: 65px;
}
.html_elegant-blog #top header.entry-content-header {
position: relative;
}
.html_elegant-blog .av-vertical-delimiter {
margin-bottom: 40px;
}
.html_elegant-blog #top .post-entry .post-title, .html_elegant-blog .avia-content-slider .slide-entry-title {
padding-bottom: 0;
}
Cheers!
Josue
Hi Vinnie
I tried what you adevised me and these are the results
1) SuperCache Active: 65/100 on mobile – 75/100 on desktop – user experience 99/100
2) Wordfence falcon engine active: 66/100 – 75/100 – 99/100
Without both 62/100 – 70/100 99 – 99/100
The test told me that i have to optimize Browser caching, to minimize Java script and CSS, delate java and CSS that they stop to see staff above the fold,
but unfortunately i don’t know what they mean :-((
Hello. The Layerslider is there at the top of the page, with a very short delay.Any tips on how to target a specific Layerslider, with Media Queries would be appreciated.
Thanks,
Ryan
Hi Kriesi
I am having a situation in resizing all my icons i use with iconbox
If i resize one iconbox icons that others change as well, so one looks gaad but the rest are all off.
I would just like all of my icons to be bigger and the same size.
So as an example i used
#top .iconbox .iconbox_icon {
width: 45px;
height: 45px;
line-height: 45px;
font-size: 40px;
}
that took care of the “Why Choose Us” part on my homepage but now the rest of my icons are not aligned correctly.
Is there a way to have them all the same size? so the icons on placed above would be the same size as icons placed to the left or right of content, how can i style them individually?
Just need the correct CSS to use here, if you could point me in the right direction or maybe another post.
Thank you for your time
Hi,
Open js/avia.js and look for line:
groups : ['.avia-slideshow', '.avia-gallery', '.portfolio-preview-image', '.portfolio-preview-content', '.isotope', '.post-entry', '.sidebar', '#main', '.main_menu'],
Replace it by this:
groups : ['#main'],
Regards,
Josue