Thanks Devin. Unfortunately this means that we’ll have to re-upload all of the portfolio images since it looks like you have to set the position when you upload each image. I was hoping I could change the position using the functions.php file and then re-create the thumbs using a thumbnail rebuilder.
Update: After changing the crop position I was able to use another plugin to recreate the thumbnails. I did not have to reupload anything.
-
This reply was modified 12 years, 2 months ago by
Estland.
I’ve configured a layerslider with a div layer that contains text and the positioning on the layer itself which produces the following:
<div class="cta_button" style="width: 200px; height: 40px; font-size: 20px; line-height: 40px; white-space: nowrap; padding: 0px; border-width: 1px;"> Sign Up for Free </div>
The rest of the styles are located on the external class, with style as follows
.alternate_color div.cta_button,
.cta_button{
color:#fff;
font-family:arial, sans-serif;
font-weight: bold;
text-align:center;
vertical-align:middle;
background:#7cc423;
border-style:solid;
border-width:1px;
border-color:#279621;
}
when it loads on my nexus4 on chrome, the button shows up blurry as if the responsive calculation is stretching it by 10x. it does not repro on a small window on desktop, nor on nexus 4 firefox. Any thoughts?
If you’d like to take a look at the site, its here: http://www.avidretail.com
To further follow-up, it appears that not selecting the default option basically breaks the breadcrumbs in the subheader, so that each individual post sees it’s parent as the Home page.
As a result, I don’t know what’s the easier fix… a.) fixing the breadcrumbs ‘system’, even when not selected in the theme Options, or b.) selecting the modified blog page in the Theme Options, and convincing it to not overwrite the configuration settings.
If I have to I’ll re-select the Theme Option and forgo the additional text at the top of the blog pages, but that is not an ideal option.
Daniel
I’d like to continue this topic on the question of formatting the default “Blog” page.. Like the original author, I wanted to customize my blog page with a simple intro text and image. Clearly using the default option in Enfold->Them Options needs to be deselected, and that works… BUT…
When I click on the individual blog postings, the title and URL in the sub-header for each of them defaults to “Blog – Latest News” and the URL points to the homepage. I need it to go back to the original blog page.
Suggestions?
Daniel
Hey Vada!
You can try this plugin: http://wordpress.org/plugins/thumbnail-crop-position/
Best regards,
Devin
Hey @scanman2121 – Can you post a new topic with the exact error you are getting? This topic and the responses from Peter are very specific to this user so far and I don’t want them to get confused and prevent a resolution from happening.
I have screenshots of websites I’ve created and want to use them in the portfolio gallery. The default behavior for the gallery thumbnails is to crop and center the image which cuts off the top of the screenshot. I would like to have the thumbnails cropped from the top of the image.
http://preview.estlanddesign.com/portfolio-item/
On the portfolio single page I would like to use the full size image instead of the resized image.
For example I’d like to use
http://preview.estlanddesign.com/wp-content/uploads/2013/05/vr_website.jpg
instead of
http://preview.estlanddesign.com/wp-content/uploads/2013/05/vr_website-495×400.jpg
What would be the best approach to modifying the portfolio pages to accomplish this?
I wanted to try something and change the background of the search popup and tried to change its css attribute in the Custom.css…did not pick it. I tried in Layout, did not pick it. So I tried in the dashboard custom css section and that worked.
I think the site dynamic css that is written in the uploads folder may be writing on top of the css in those other files. This means that you are kind of limited to the css colors you set in the theme’s tabs. In my testing I was trying to use:
#top .header_color .input-text, #top .header_color input[type='text'], #top .header_color input[type='input'], #top .header_color input[type='password'], #top .header_color input[type='email'], #top .header_color input[type='number'], #top .header_color input[type='url'], #top .header_color input[type='tel'], #top .header_color input[type='search'], #top .header_color textarea, #top .header_color select {
border-color:#cccccc;
background-color: #ffffff;
color:#000;
}
because I had set the top backgrund to be dark the background for the search was dark as well.
So I would like to know if there is a way to make the custom.css be the last css parsed so that the declarations in it are not overwriten by the custom one. The problem with relying on the custom css field is that anybody can destroy the site by erasing that section by mistake in pressing the wrong button (it happened, just like the import custom pages can screw up a website is an admin presses the wrong button) I always remove the admin section for importing dummy content because I don t trust other admins to not make a mistake but with the css one its more of a problem as there is no going back if you reset the styles.
Anyway, which css is the last one to be picked up and could the next version fix the order and pick custom last please :)
Thanks
This reply has been marked as private.
If you just want the image centered you can use any of the other sliders included as elements with the advanced layout builder.
With LayerSlider, you aren’t just creating a single slideshow but instead a complex stage with lots of characters that all have to arranged. So your big background image needs to be a part of that stage how you want it to get placed. The size doesn’t really matter.
The plugin has all of its documentation included inline if you hover over fields as well as if you click the “Help” tab in the top right corner of the screen.
Make sure to also read the descriptions of each of those fields in the Basic global settings. The “Layers” container for instance is the pixel width of the “layers” in your individual slide. If you set that to 800px then the contents of your slide will never go beyond 800px.
Hi,
I have published some wallpaper for my readers to download. I have put the pictures on my dropbox and use the links in order to share those images.
The problem is , when I put the link on my wordpress, it does as if it wanted to open it in a lightbox and give a error message.
I have inserted the link as usual and ask for it to open in new window…
The only way my reader can access the file is to right click on the link and click open in new window.
That’s not practical at all.
How can I force enfold not to open my link in lightbox and allow my dropbox links to work?
You can find the problem here
http://www.calliframe.com/fonds-decran-de-janvier/
You can click on the words: desktop tablette and mobile to see the problem..
I tried with another site with a different theme and it works fine..
Kind regards and happy new year ;-)
Chrys
1. As I said, the container for the page is that wide. So shrinking it down to be smaller only shrinks it less than full width. So the border on the top isn’t something that can just be shrunk on either side.
2. I’m only seeing the masonry show under the menu like it should (since the menu is semi transparent).
Hey guys,
So I centered the logo and main menu to fit UNDER the logo. It renders fine on my desktop…however, when viewing on my IPAD the main menu is butted up to the right and the tabs just stack….anyway to fix this?
See snap: http://dev.lorenasarbu.com/ipad.jpg
Thanks!
J
This reply has been marked as private.
Hi!
Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:
#top .more-link {
background: #c3512f;
border-radius: 2px;
padding: 7px 25px;
color: #fff;
}
Best regards,
Devin
Thank you Peter,
It works! But now in Safari when the image is resizing while scrolling the page, it is shown pixelated, although when the logo stops resizing, it renders ok. If you know any solution that works for all browsers, it would be perfect.
But still there´s the issue when narrowing the browser window, as you can see in my captures, the top header (social icons and phone) pushes the header and the logo is hidden and the scale of the logo is bigger than expected. Trying a lot of options, I have figured out that this issue happens when you put something in Enfold > Header > “Phone Number or small info text”. Content in that field makes the logo bigger and that way it doesn´t fit into the header band. It only happens when narrowing the browser window by hand, not when the page open in a smartphone. Hope you know how to fix it.
Regards.
Hey!
Following code should improve the performance of image scaling for Firefox users
#top .logo img, #top img, #top a img{
image-rendering: auto;
}
Try to insert it into the quick css field.
Regards,
Peter
Hey!
Please try to insert following code into the quick css field to fix the issue
#top #header .avia_mega_div > .sub-menu > li.avia_mega_menu_columns_4{
width: 250px;
}
Best regards,
Peter
Hey jacquesfriggieri!
You can use following code to increase the textarea size of the comment box
#top .comment-form-comment textarea {
width: 97%;
}
By default the width is set to 92%. Insert the css code into the quick css field or into your child theme style.css file.
Cheers!
Peter
Hey!
@wholereneducation – did you add the
add_theme_support('deactivate_layerslider');
code to your child theme functions.php? If not you must insert the code at the very top of the parent theme functions.php below
<?php
global $avia_config;
because the theme will check the if() condition immediately and if you declare the add_theme_support() code at the end of the functions.php file it’s too late.
Best regards,
Peter
I’m trying to get the layer slider to center the banner image on the homepage for smaller laptops.
http://microhound.com/
It works great on screen size of 1920×1080 , but when the size is smaller the banner image I created will go to the right until it is cut off.
The banner I created is 1920×470 Its the second and third banner that I am having a problem with.
Thank you for your help
Try watching this video as I think you are overthinking it: https://vimeo.com/67651241
Each column is one indentation within the mega menu item. The > I’m using are only for illustration here in text.
So in your menu:
Mega menu top level name
> Column name
>> Column list item
>> Column list item
>> Column list item
> Column name
>> Column list item
>> Column list item
>> Column list item
Would give you 2 columns with 3 items inside of them.
We don’t have any ability to address the email/bbpress issue right now which is why I didn’t respond to it initially. I’ve asked Kriesi to take a look but its nothing we would be able to address at the moment or in this topic.
Hey kecster2!
You’ll need to add a z-index to the header buttons css. For example:
.header-buttons {
position: absolute;
right: 0;
border: none;
z-index: 10;
}
It looks like the image uses is a bit taller than the top nav so you’ll probably need to adjust that as well.
Just note that although we do often provide custom css for customizations like this it doesn’t guarantee it will always work flawlessly or have full cross browser support. Customization isn’t generally covered by support.
Best regards,
Devin
I have seen several different answers for this but it seems they all talk about padding for the top and the bottom. I would like to reduce the space between the two layout elements I have in place on the frontpage. I have a 1/4 and a 3/4. In the 1/4 box are two promo boxes and in the 3/4 is the easy slider. I want the space between them to look similar to the small space between the red menu and then top of the content elements.
http://lizybloomdesigns.com/storeboards.net/
Thanks.
Lizy
-
This topic was modified 12 years, 2 months ago by
lizybloom.
i received some help from you guys a couple of weeks ago and added the green “live chat” and blue “contact us” button on the top menu bar… http://j2k.info/american/ can you please help me, not every part of the two boxes is clickable.. i didnt use image maps, i just used the code given to me by you guys.. but only certain parts of the graphic are clicable…
Thanks! just so I’m sure I have it right – below is exactly what I have – is this correct?
.ls-fullwidth .ls-playvideo {
width: 70px;
height: 70px;
margin-left: -25px;
margin-top: -25px;
background-position: -290px -140px !important;
}
.ls-fullwidth .ls-playvideo {
width: 70px!important;
height: 70px!important;
}
.ls-fullwidth .ls-playvideo:hover { opacity: 0.5; }
I think I already have that – this below is exactly what I have:
.ls-fullwidth .ls-playvideo {
width: 70px;
height: 70px;
margin-left: -25px;
margin-top: -25px;
background-position: -290px -140px !important;
}
Hi PhilCarabet!
You are currently using Enfold version 2.0.1 which is fairly old. Please login on ThemeForest with the account you have purchased Enfold and go to Downloads section to download the latest version and update via FTP. Let us know if issue remains after the update
For a quick guide on updating your theme take a look at this video on updating the Enfold theme via FTP: https://vimeo.com/channels/aviathemes/67209750
Regards,
Yigit
Hey!
Currently, changes Josue made looks fine on my end. You can add following code to Quick CSS to remove page title and border from breadcrumbs bar
.title_container .main-title { display: none; }
#after_layer_slider_1 .container_wrap { border-top-style: none; }
Regards,
Yigit