If we can have options for full functional menu on top, left, right, or even bottom. And the options for the top menu below a huge header image (full screen), it stick to top when you scroll down. This design is getting popular for one page design.
Regards,
Darren
Hi all,
I have been working with Enfold for a number of sites now and never actually needed this forum :) However I have one now where I want something special. I am not sure if a support forum is the place to be as its more like a customization of the masonry portfolio.
So whats the deal?
Its possible to show title and excerpt on the hover panel of the items in the masonry, however I would like to show an image there. I was able to do this by setting it to excerpt, and add <img src=” etc to the excerpt. Looks pretty ok, only now ofcourse in the search results the image is shown aswell, and probably will on other areas of the site at some point.
Here is a screenie of the work in progress: http://www.borkent.com/screenie.jpg
I have a custom metabox setup in the portfolio admin to add the image needed for the figcaption hover panel, and I found the code in masonry_entries.php “<div class=’av-masonry-entry-content entry-content’ {$markup}>{$content}</div>” but somehow I just cant get the image to show correctly, it either breaks entirely or shows multiple instances of the src url.
If anybody can tell me how to squeeze in this custom metabox entry without it duplicating zillions of times etc etc I would be very greatfull! Or maybe there is a way to use a function to insert something there?
Kind regards and thanks for awesome themes!
Thomas
ps. just clicked my link and I see it opens in the lightbox, this is the same lightbox as on the enfold template and it has some css bug. Here is a css fix for it.
problem: http://www.borkent.com/screenie_lightbox_kriesi.jpg
fix:
@media only screen and (max-width: 767px)
{.pp_details {
height: 50px!important;
width: 100%!important;
}}
div.pp_default div.pp_content_container .pp_details {
margin-top: 5px;
}
I also noticed I had to change some stuff to get logos working correctly in responive mode, I fix it with this:
@media only screen and (max-width: 767px){
.responsive .logo img {
margin: 0 auto;
max-height: 80px!important;
}
I have looked through the threads and tried a few quick CSS edits. Nothing seems to work with getting the logo to shrink on a mobile device?
Here is the website link: http://yeshejacksonart.com/
Also How do I slow down the exit of the images in the layerslider? This is a tricky deal…hehe.
Thanks in advance!
Joshua
This reply has been marked as private.
kcParticipant
I’ve been able to somewhat achieve what I’m looking to do but I am not quite there yet and need help.
I have created a page with multiple color sections, each with their own ID.
I then add those IDs as custom links to the Main Menu.
Clicking the menu scrolls me to the desired Color Section.
Manually scrolling to the a color section highlights the nav item. Perfect.
HOWEVER…
I want to create the menu for the page targets on the PAGE itself, not on the main menu and have that menu ‘dock’ under the main menu when scrolling so that it is persistent below the main menu.
I have turned off main menu size transforms so that it is a fixed size.
Please have a look at these images to see what I am describing…
View of page nav on pag (POC page)
http://www.keithcorcoran.com/x01.jpg
View of page nav on POC page when clicking on or scrolling to About Us target.
http://www.keithcorcoran.com/x02.jpg
View of Main Menu rollover over top of persistent page nav
http://www.keithcorcoran.com/x03.jpg
I have tried to create a new custom widget area at the top of the page with a new menu within it but the menu doesn’t behave as the main menu does with regards to class name updating to ‘current-menu-item’
Here are the needs for this request
- This ‘page contents menu’ I’m trying to create should be on the page itself.
- Menu would be manually created for each page it is needed on.
- Menu should be at a z-index above the current page and stay fixed below the Main Nav
- Clicking link on Page Contents Menu should scroll to Color Section Target
- Scrolling to Color Section Target highlights target in Page Contents Nav
I can manage the css myself mostly unless there is some trickery to highlight the nav. I’m looking for a way to make this happen even if it means adding/extending some functions.
Thanks!
-
This topic was modified 12 years, 2 months ago by
kc.
-
This topic was modified 2 years, 3 months ago by
Yigit.
Thanks Ismael. I have multiple tables in the site. How do I make these modifications to only one of them?
Also, how would I limit image size in a table. I’ve tried the following in the table cells, but it doesn’t seem to work.

Can you explain what it is the images are showing? Kriesi and I have both tested the theme on various iPads and have not gotten any critical issues.
The screenshots shot lots of different things which could be any number of issues with various sources so an explanation of what exactly the issue is will be needed to proceed.
Ok, and now on the front page where I have the posts slider. Where do I fix that thumbnail to not be cropped?
http://www.lanceblaise.com/
Thanks for the help so far!!
Worked like a charm! I forgot about using the ID for the CSS; now I know what it’s there for.
Thanks much!
Okay, well thanks for your help Ismael! I won’t change anything because I don’t want to mess with hard coding and updates. I finally got on board with Child Themes for that purpose.
—-> Lazy. lol
Ismael:
Single Author, big preview Pic (no author picture displayed)
But it’s in a Blog Grid format: http://planningforever.com/blog
Because I could NEVER get the read more excerpt to work.
This reply has been marked as private.
Hi, That is much better!!
Many Thanks, but there is still some “movement” in the footer and below the three images.
Any idea?
Thanks, T.
Hi bluemoonink!
It sounds like a priority/inheritance issue with the css. Without seeing it live I can’t provide a good solution that will not effect other areas but generally what you would do in this case is add a custom ID to that color section in the field for it at the bottom of the color section options.
You can then target that ID with css to remove the image and only show the color you want. Ex:
#yourcolorsection {
background: #32add9 !important;
}
Best regards,
Devin
Hey Rolf!
When migrating a site you should be using a tool that will change image paths for you. You can also use a plugin which changes all paths in WordPress to relative to make migration easier.
So in this case the alternatives are better than changing the theme.
Cheers!
Devin
Hi Kriesi!
When using the advanced layout editor, Enfold stores the URL for images with an absolute path, e.g. http://www.domain.com/someblog/files/2014/01/104314531-2-300×200.jpg instead of storing a relative path like “files/2014/01/104314531-2-300×200.jpg” .
This is a big problem when trying to change the URL of the site, since the pictures still point to the old URL. Same problem occurs, when bulding the site on a multisite installation and then trying to assign a domain as the last step.
Couldn’t you male Enfold store only relative file paths? The these scenarios would work smoothely.
Thanks,
Rolf
The images get loaded into the container and then are stretched to fit that container. This is how the theme keeps everything “responsive”.
So the size you select is only the size that is actually added to the html for that specific set of images. The container will always stretch the images to fit that area where the slideshow is added to the page.
I updated the text next to the dropdown in the theme files so that it will hopefully be a bit more clear.
Your solution is what I usually recommend if you need to use smaller images than what the layout would typically show so I’m glad you found it already :)
Hey akamaxbuz!
Please refer to my post here https://kriesi.at/support/topic/change-logo-image-for-scrolled-header/#post-188003
If you want to double the size, instead of 200 please enter 176 then add following code to Quick CSS in Enfold theme options under Styling tab
.fixed_header #main {
padding-top: 176px;
}
Cheers!
Yigit
HI
I am using the Layer Slider on my homepage and there is some text layered over the background image.
Currently when i view the homepage on different devices the text blocks that i have positioned in the middle when viewed at full size end up dissapering off the screen on smaller devices.
Is there a way of keeping the centre of the image, and the centre of the text blocks in the centre of the screen for all device sizes?
Failing that, is there a way of losing the slider all together on some of the smaller devices?
Also how do i add a button as one of the layers in the layer slider?
thanks
Hi!
Can you post a screenshot? Which browser are you using? It does look fine on my end please see http://i.imgur.com/I01tyGU.jpg
Cheers!
Yigit
Hi, I just noticed a problem in IE10. See this page (http://goo.gl/HqQKMd) and scroll down to section “How to use …”. The image (with the tabs on the right) is cut in half and way too big, even though it looks perfectly fine in Safari, Chrome and Firefox. Compare with another browser to see the difference.
Any way (css, php, …) to force the image to fit inside the provided space?
Thanks in advance.
-
This topic was modified 12 years, 2 months ago by
DavyE.
A few moments after I typed my response I found a solution (or I guess what you were trying to tell me?)
-Created a PNG file with transparency
-666px x the height of the original image. So since these particular images (that I was having problems with) have a height of 312px, I made the canvas size: 666×312
-Copied the original 211×312 image to the 666px png; centered it
-Uploaded – keeping the “no scale” parameter and now the images are appear as they should.
Test 2: http://www.sistahhollywood.com/14-shirts-checklist/
Thanks again for responding.
Best,
Sistah Hollywood
is it possible to apply the lightbox => enlarge on click effect on a standard image instead of using the gallery?
Thanks so much for responding.
Apologies if I’m a little dense but your answer isn’t clear to me…
If the images I upload are 211×312 because that’s the original size and I select to NOT scale them, why is the theme stretching them to 666px x some random height; whereby making them very pixelated. :-(
Not to mention it doesn’t matter what selection I make via Slideshow Image Size, the theme still stays at 666px width.
Sorry I’m not following but your recommended fix doesn’t make sense to me because I’ve tried multiple images with different sizes – keeping the “No Scaling” parameter.
How do I get this to work exactly like the theme demo? (i.e. Home / Portfolio / Portfolio 2 Column / Single Portfolio: 2/3 Slider) What parameter/setting was used? And do I have to use a specific image size to start with?
Thanks for in advance.
Ok I’ll try it and get back to you. Thank you!
Hey!
Please do try that one. I’m sure serving an image with twice the size will make a difference on retina display. You need to specify half the size of the actual image size via CSS.
Regards,
Ismael
Hi there,
Is there a way to have my legends size smaller for iPad (portrait) and iPhone so that they don’t come all over the images ?
Thanks a lot,
Marie
pre-production link : http://eq59799.amanda6.nfrance.com/
This reply has been marked as private.