1305 comments found.
I have several questions about your theme on my website: https://ilsewolf.nl/test/
1. In my portfolio single pages and portfolio overview (see: https://ilsewolf.nl/test/in-opdracht/), with Gallery layout, some photos in the grid get some weird colorization. When you click the photo they show the correct colors. Any idea what might be wrong? See the fifth photo on here: https://ilsewolf.nl/test/portfolio-item/portret/
2. The contactpage is fine on Safari, but on Google Chrome the contact info and contact form aren’t in the same row anymore? How can I fix this? https://ilsewolf.nl/test/contact/
3. On my portfolio single pages (gallery) I would like the top photo, full screen one, to have less height, the same as a normal header background, as shown on the contactpage: https://ilsewolf.nl/test/contact/. How can I achieve this?
4. Portfolio overview page seem to have a weird bug, where the portfolio disappears under the footer see: https://www.ernstdejong.nl/ilse.jpeg any idea what causes this?
1. That hover effect adds a bit transparency to the image. You can change it to other effects if you wouldn’t like that style.
However, if you’d like to use that effect and disable the transparency, you will need to add custom CSS below to your site:
@media only screen and (min-width: 1200px) {
.w-effect-overlap figure .cover-image {
opacity: 1;
}
}
2. You should remove the negative margin from that row, it would make the row and column couldn’t work correctly.
Edit the second row, select the Design Options tab and remove -3% from the top margin.
3. By default, it displays the original dimension of your image, you should use the landscape image or crop it to shorter before uploading.
Also, you can add custom CSS below to set the maximum height of the image in the header:
.portfolio-gallery .post-media img.cover-image {
max-height: 500px;
}
4. I tried it with several browsers but couldn’t reproduce the problem. Everything seems to work fine on my end. If you just updated the theme, it might be a browser caching issue. Try to clear your browser caches to see if it works.
1. That’s not exactly what I mean, even without hover it shows a weird colorization in the grid, see: https://www.ernstdejong.ni/gridilse.jpg
2. Is there another way to remove the spacing on top between the row above it and the row with the contact information / form?
3. This works, is it possible to have the photo / column more centered? Now the top is cut of?
4. Hmm, it happens quite often..
1. The link is wrong: https://www.ernstdejong.nl/gridilse.jpg
1. What I meant to say is that the hover effect adds a bit transparency to the image on idle state not hover, so it would make your image has different color from the original (even without hovering).
Also, the custom CSS I provided will disable that transparency so it will correct the color of the image too.
Anyway, I’m sorry but I couldn’t access the screenshot you provided, try to check the link again.
2. You can set the Vertical Padding Size in the row settings to “No Padding” to remove the gap between rows. However, if you enable the Overlap to make the column or row to the top, you will have some gap below it, you should reduce the Distance of the Overlap option from 100 to shorter to make both rows closer.
3. Actually, it is now center. Your image is cut off because it is taller than the background area. The background area is a rectangle that has the width greater than the height but your image is almost square so it won’t fit correctly.
If you’d like to set the maximum height of the background area to 500px, that means it will be a landscape dimension, your image size should be 1920×800px or similar.
Here’s the custom CSS to change the background position to top instead of center so it will cut the bottom of the image instead of the top:
.portfolio-gallery .cover-image {
background-position: center top;
}
4. It is mostly a caching issue because it is working on my end. You can try to press Ctrl+F5 (Command+R on Mac) to force your browser to load new resource files from server instead of caches.
Try this link: https://www.ernstdejong.nl/gridilse.jpg as your CSS doesn’t work
Thank you for the screenshot, this makes me see exactly what you’re looking for.
This is a picture profile issue, it looks like you have set the picture profile to CMYK. However, when working on web, you should set the image profile to sRGB so it will appear correctly on the computer monitor and mobile device screen.
If you’re using a Photoshop, you should choose “Save for web” when saving the picture, and make sure the option “Convert to sRGB” is selected.
Hi, I just noticed then when I’m on mobile or tablet device, I can’t click on the portfolio pictures instead of when I’m on my computer. How can we correct that?
And what’s the «intelligence» in the related posts, I can’t find how to choose wich posts I want…
Could you help me with this please? dev.orijine.com
Thanks!
1. Looks like you have disabled the container of the portfolio grid on mobile and tablet, so it doesn’t show up on those devices.
You will need to edit the column container of that Portfolio Grid, select the Responsive Options, and uncheck all boxes in “Hide on device” to show it on any devices.
Also, on mobile and tablet devices, you will need to click on the portfolio title to see the portfolio details page. It won’t work if you click on the image. However, we will look into this, and make the image clickable too in the future.
2. The Related Posts section displays the posts from the same Tags, you have to set the Tags/Portfolio Tags for the posts if you’d like to show them in the related posts.
Hi,
When viewing the cart page on our website, on small screens 992px wide or less, the product image and the price are not on the same row. Please see screenshot link below:
https://www.awesomescreenshot.com/image/3352648/c5294c40944016c9de12735cfa2f883aThis is what your demo looks like:
https://www.awesomescreenshot.com/image/3352649/98db8332973d27d41f43f5f6332550c7This is our website:
https://www.capebyrondistillery.com/cartCould you help me with this please?
Many thanks 
Hi,
This issue has been fixed in the Overlap 1.4.1, you can find more details in the changelog: https://themeforest.net/item/overlap-high-performance-wordpress-theme/15344205#item-description__update-log
You will need to update the theme to fix it.
Great. Thanks
It seems to work on my end. The image looks good in the lightbox.
Try to press Ctrl+F5 (Command+R on Mac) to see if it works, this will force your browser to download the new resource files from the server instead of the caches.
However, the lightbox won’t show your image as fullscreen, it always have the gap at the top and bottom of the image, this is how that lightbox works.
HI, I installed your update today (to 1.0.1) and now the Portfolio Options (when you’re editing a portfolio post) are missing. Is this because of the update?
Please ensure that you have also updated the Wyde Core plugin. The latest update of the Overlap theme (1.4.4) comes with Wyde Core 3.7.7, as you can see in the changelog below:
https://themeforest.net/item/overlap-high-performance-wordpress-theme/15344205#item-description__update-logThat fixed it, thanks. I didn’t see that there was an update for the Core plugin available. But I still have another problem. I installed demo content for the theme (Personal Portfolio) and then created a new page to act as my home page. But when I call up my website it always loads the main demo page (https://wydethemes.com/overlap/) as home page. How can I fix that?
You have to set up the home page in Settings -> Reading, choose your new home page for the “Homepage” option.
That’s what I did, of course
But it was my fault anyway. At some point I had set the site to “One page” which, of course, pulls the content from the primary navigation (which I hadn’t configured yet and was still the full demo content). I wasn’t aware of that and therefore rather confused about the behaviour of my front page.
Thanks anyway for your support!
Glad to hear that you have figured it out
Hi, Is it possible to install an instagram feed instead of flickr ? Thank you.
The Instagram Feed widget is not included in the theme. You will need to install the third party plugin to show the Instagram feed on your site.
Maybe, it would be added in the future updates.
Hi, how do I set the footer height? I would like to close up the space as its too tall for my content. Regards
Actually, it should fit your footer content as you can see on our demo site.
After inspecting your site, there is a hidden gap underneath your Instagram widget. Looks like a bug of that widget, you will need to add custom CSS below to hide it:
#eapps-instagram-feed-2 .eapps-instagram-feed-posts-grid-load-more {
display: none;
}
Hi there, thanks for the reply. I’ve added the css code provided (thanks) and also changed the vertical padding of my main footer row to ‘none’ however, there’s still a fair amount of space between the footer and the footer bar… can this be reduced somehow?
It seems like you have changed the Instagram widget in the footer area, the ID of that widget was changed from 2 to 1 so the code I provided couldn’t work correctly.
You may need to replace it with the new one below:
.eapps-instagram-feed-posts-grid-load-more {
display: none;
}
However, that Instagram plugin is not included in the plugins support list. I would recommend you to use the Instagram Feed widget from the Overlap theme instead. The latest update of this theme (1.4.4) includes the Instagram Feed so you don’t need to use other Instagram plugin anymore.
Also, to use the Instagram Feed from the theme you will need to setup the Instagram Access Token in Theme Options -> Instagram Feed first.
Hi, thanks for the reply. I didn’t have that css in my customisation so that must have been the problem. It’s removed the additional spacing so that’s great, thanks. I’ll use the overlap insta feed for my next site so thanks for the notification on that. Cheers
Hi, is the icon box element able to have an image instead of icon displayed? Regards
We’re sorry, the Icon Block and Info Box do not support image.
Page Title: Hi, the page title text size and weight doesn’t seem to correspond to the settings under typography. Where can I adjust this please? Regards
The settings of the page title text size and weight are not available in the theme options panel. You will have different text sizes and styles according to the size of the page title area you’re using.
You can change the page title area size in the Overlap Options -> Title Area -> Size on the page edit screen.
If you’d like to change it, you have to add custom CSS like the one below to Appearance -> Customize -> Additional CSS:
.title-wrapper.w-size-m .title {
font-size: 50px;
font-weight: 600;
text-transform: uppercase;
}
Hi, I have a question about the portfolios. On the portfolio pages, I know that there are a few different layout options. But the grid one, which I was going to use, looks bad when the images are different sizes. And I don’t want to make the images all the same size, because I’m showing someone’s artwork, and they have different size/dimension images.
So my question is, how can I do a masonry layout, for the portfolio page? If you can give me the code I can do it myself… If not, then I won’t be able to use the portfolios. I know that you also have an image gallery, which I’m already using… But I like that the portfolio has albums, which say how many items are in each one.
Thank you!
Lily
To display gallery images on single portfolio page in masonry layout:
1. Add custom CSS below to Appearance -> Customize -> Additional CSS to hide default gallery images (in a grid layout).
2. Build your portfolio content by using WPBakery Page Builder, add an Image Gallery to the portfolio content.
If the page builder is not enabled there, you can enable it in WPBakery -> Role Manager, choose “Custom” for Post types, and select “wyde_portfolio”.
3. In the Image Gallery Settings window, add images to show in the masonry layout. Change the Gallery Type to “Masonry”, and Masonry Layout to “Auto Height”.
If the “Auto Height” layout is not available in the Image Gallery settings, you will need to update the Overlap theme.
Thank you so much! The only thing is… I am not sure what code to use to hide the default gallery images in the portfolio. I can try to figure it out… But I just don’t want to mess everything up. If you could give me the code I would really appreciate it. If not, I will play around with it and see if I can get that to work.
Thanks again!
Lily
My apology!
Here’s the custom CSS to hide the default gallery of the portfolio:
.single-wyde_portfolio .post-media {
display: none;
}
Thanks so much! I actually figured it out yesterday, but I did a slightly different code… I also went into the PHP files and removed the sidebar, because the portfolio was showing up on only 3/4ths of the page.
But today I changed the CSS code to yours, and it works but there is just one issue. And it’s actually something that I’ve noticed on other pages too. There is a lot more white space on the right side than the left. In other words, the main content is not centered and even though on some pages I have it set to full width (instead of boxed) there is still more space on the right. Is there anything I can do to fix that?
Thanks again for your beautiful theme and all your help! Excellent customer service!
Lily
First of all, if you’d like to edit any PHP files in the theme, please do it in your child theme to make sure your changes won’t be lost when you update the theme.
Also, if you have removed the sidebar from the portfolio page, you have to change the width of the main content too.
To change it to fill the main container:
Replace:w-main col col-9With:
w-main col col-12
However, if you’d like to have the portfolio content without sidebar, I recommend you to use the Gallery layout instead, see the demo below:
https://wydethemes.com/overlap/portfolio-item/portfolio-12/Hi, sorry for the late reply. Thank you. I had figured out earlier how to change the columns in the PHP files from 9 to 12. But I do have a couple questions for you.
1) I’ve never used child themes before, so I’m not even sure how to do that. Do I just make the same changes that I made in the PHP files but in the child theme? Because I know there already is an update right now and I don’t want to lose all the changes I’ve made.
2) The second thing I wanted to ask you about is how the content on nearly all the pages is not centered, and I don’t see a way to change that. How can I change it so all of the content is centered? What I’ve been doing as a temporary fix is adding some margin to the left side, but I don’t want to mess up how it’s going to look on a mobile device, by adding empty space on the left side.
Thank you again for your help!!
Lily
1. You should move all changes you made on the theme directly to the child theme instead. You will need to install the overlap-child-theme.zip first, then move all changes from the theme files to the files in your child theme.
For example:
If you’ve edited the portfolio template file in “overlap/templates/portfolio/single.php”, you will need to copy that file to “overlap-child-theme/templates/portfolio/single.php”, then edit that file to suit your needs.
You can find the instructions here: https://codex.wordpress.org/Child_Themes#Creating_a_Child_Theme_from_a_Modified_Existing_Theme
2. Adding any margin to the main container will make it not be centered, you will need to remove your changes you made on it. You should add some padding to the row or column instead. If you’d like you can give me the link of that page so I can provide the right solution to work around this.
Hi, I want to hide the sliding bar on mobile devices. Is there a setting for this? Regards
It should not show up on mobile devices by default. Also, I just visited your site on my iPhone, the sliding bar doesn’t appear on my end.
hi just revisiting this ticket as I’m having a similar issue with another site – the three dots and slider menu are still showing on mobile…you can use the previous credentials to login and check if you need?
@media only screen and (max-width: 1079px) {
#header .top-menu .menu-item-slidingbar {
display: none;
}
}
Hi, on desktop, the cart has a drop down menu with “my account” and “sign in”, which displays fine. I would like to hide this drop on mobile however and have the link (when clicked) go directly to cart. Can you provide css to achieve this? Thanks in advance!
Thank you for reporting this issue, it will be fixed in the next update.
However, if you’d like you can fix it right now by adding custom CSS below to Appearance -> Customize -> Additional CSS:
.mobile-nav .menu-cart {
display: none;
}
Great. Thanks.
Hi, the mobile menu for my site doesn’t appear to work when on the shop page. It doesn’t drop open and can’t be clicked through. The only way to leave the page is to click the logo (and go home) and then the menu works fine. Please check this?
This is the same issue as the recent question. There is an error on your shop page, the mobile menu won’t work properly.
Please ensure that you put nothing to that page. The Shop page is a WooCommerce reserved page, you should leave it blank as you can see on WooCommerce documentation: https://docs.woocommerce.com/document/woocommerce-pages/
If it still doesn’t work, it might be a plugin conflict issue. Try to deactivate other plugins to see if it works.
Hi, nothing has been changed on the shop page, and the other woo commerce pages are working fine (cart, account) with the mobile menu so this doesn’t make sense? Is it an error or is it a plugin issue. Your reply doesn’t clarify which or specify a helpful solution?
There is a PHP error on your shop page. By default, the debug mode on your WordPress site is disabled, it won’t show any error message so I couldn’t identify the problem.
The demo content from this theme includes 3 shop pages. You will need to use the one that has nothing in the page content as your shop page. Even you have never changed it but if you’re using the custom shop page that includes any shortcode there, it won’t work correctly. That is why I asked you to make sure nothing is there.
However, I’ve checked it for you, some shortcodes were found there, that is why it was error.
I just removed them all, then your shop page seems to work now.
Ok, thanks for explaining that and fixing the problem. I’ve checked and the mobile menu now seems to be working fine, as you’ve said. Thanks! I’ve just noticed that the same shop page is rendering the footer differently to the rest of the site (and dropping information on mobile) – can I amend this somehow?
This issue has been fixed in the next update of the theme.
However, you can fix it right now by adding custom CSS below to Appearance -> Customize -> Additional CSS:
.woocommerce h2:not(.product_title) {
text-transform: none;
margin-bottom: 0;
}
Hi, On my shop page, I have set the header to non-transparent but when the page scrolls, the title image can be seen scrolling behind the header in a small horizontal section. I’m not sure why this is? Can it be amended for this page?
I think that it doesn’t work correctly because there is an error on your shop page.
Please ensure that you put nothing to that page. The Shop page is a WooCommerce reserved page, you should leave it blank as you can see on WooCommerce documentation: https://docs.woocommerce.com/document/woocommerce-pages/
If it still doesn’t work, it might be a plugin conflict issue. Try to deactivate other plugins to see if it works.
this doesn’t seem like a satisfactory response??
I’m sorry but it doesn’t show any error message on your shop page so I couldn’t identify the problem. Therefore, I asked you to check the shop page first. If it is not a shop page issue, it is most likely a plugin conflict issue.
However, I’ve removed the shortcodes from your shop page, then it seems to work now.
Hi, I have one particular image that isn’t being displayed on mobile and I have no idea why? There doesn’t seem to any additional css class comments in the row settings or for the image. Can you check this please? First image on the “about” page… Thanks in advance.
It’s in the column settings. Edit the settings of the column container of that image. Select the Responsive Options tab and uncheck all boxes in “Hide on device” to show it on every screen.
Thanks. I had missed that option. Regards.
Hi, I want to change my cart icon in the main menu (from clipboard to actual cart). Where can I do this? Thanks in advance.
Actually, it is a shopping bag icon, not a clipboard
.menu-item-cart > a:before,
.menu-item-shop .ol-cart-1:before{
content: '\e84d';
}
Haha ok. Yeah of course. Well, I’ll check what my client is after…. thanks for the help! Regards
just returning to this ticket…can this code be customised ie another icon used, not a cart?
Sure, you can change it to another icon, you will find the Overlap icons list in the CSS file “overlap/css/icons.css”.
Great thanks, its also pretty small, can I increase the size?
also, i only see code for the shopping bag or the shopping cart?
.menu-item-cart > a:before {
font-size: 20px;
}
2. I’m sorry, I’m not quite sure how do you want to customize the icon. I thought that you’d like to change the shopping cart icon in the top menu to another one. If so, you will need to add the snippet like the one below:
.menu-item-cart > a:before,
.menu-item-shop .ol-cart-1:before{
content: '\e800'; /* Changes the icon from cart to email icon. */
}
If not so, please provide me more details or give me any screenshot.
Hi, loving the theme but i have a problem with the blog post exerpt. When my desktop is full screen, it’s okay but if i press for example Command and – (minus) or my friends who have a smaller screen the blog page shows the full blog content on top of the overlap layout, so that in some places i have 6 text elements on top of each other and you cannot read anything clearly. pls help!
Also like to ask why in mobile view it automatically shows full blog posts and not the teaser + read more, so that the reader could see more items at once.. ? (shows them correctly, not the error that in desktop)
Hi,
Would you mind giving me the link of your blog page so I can take a closer look?
It displays full post instead of the excerpt because you build the post by using other page builder plugin (I guess it is the SiteOrigin Page Builder).
This theme comes with WPBakery Page Builder plugin and is only compatible with this page builder, I would not recommend you to use other page builder to build the post or page.
If you’re using other page builder to build the post, it might not be able to extract the excerpt from the post correctly so it will display the full content instead.
There are a couple of ways to fix this issue:
1. Set custom excerpt for every single post so it will display the excerpt exactly the same as you defined. You can find more on how to define custom excerpt in the link below:
http://www.wpbeginner.com/plugins/how-to-customize-wordpress-excerpts-no-coding-required/2. Display the full content instead of the excerpt. In Theme Options -> Blog, change the layout from Overlap to Default, and change the Excerpt to Full Content.
3. Rebuilt your blog post by using WPBakery Page Builder instead of your current page builder.
Okay i see, yes there is SiteOrigin page builder in the background since this site and the older blogposts are from my previous theme of this same site and i did not want to make the blog posts all over again, but i see the problem. Thanks for your advice!
... One more question, when i go to a single post, it only gives me the option to use SiteOrigin page builder, how can i activate the WPbakery builder without losing my old content?
You can enable it in WPBakery Page Builder Settings page. Go to WPBakery Page Builder -> Role Manager, choose “Custom” for Post types, and select “post” to enable it on the blog post.
Can you advise what size pictures size and pixel. My photos that were previously loaded receive an HTTP error each time I try to load
The file size of each photo should be less than 500KB and the width should be less than 1920px.
Hello!
We’re working on a site for a client, and want to change the permalink for the portfolio pages. However, once we changed it, all the portfolio pages are now opening as 404 errors, even when clicking on “View Portfolio” from the back end editor. We’ve tried flushing the cache, and no dice. Any advice would be great.
Thank you! - Kaity
It sounds like a permalink caching issue, try to clear the permalink settings caches to see if it works.
You will need to visit the permalink settings screen in Settings -> Permalinks, then click on Save Changes button to purge the permalink caches.
Hi, the “my account” page on my website (using woocommerce) is displaying accounts details (dashboard, orders, downloads etc) across the screen, rather than vertically. When the screen is minimised (to mobile device size), it displays fine. Can you suggest a fix or a setting change for this please?
It seems like you’ve edited that page by using the page builder. It inserts the WooCommerce shortcode into the Text Block so you have a plus icon in front of each menu item on the account page.
The “My Account” page is a predefined and reserved page, you shouldn’t edit it. This would make it couldn’t work properly. Also for other WooCommerce pages e.g. Shop, Cart and Checkout.
However, if you’d like to edit it, you will need to remove the Text Block from the WooCommerce shortcode before saving changes.
All you have to do is:
1. Edit the “My Account” page.
2. Switch from Backend Editor to Classic mode, then change from “Visual” to “Text”.
3. Replace:[vc_column_text][woocommerce_my_account][/vc_column_text]with:
[woocommerce_my_account]
4. Update the page, please DO NOT switch back to the Backend mode before updating.
Perfect. thanks.
Hi there, just following up on this as I have another site with the same problem, however, all the settings (as advised above) seem correct. It’s still displaying the menu items across the page, rather than vertically. Is this a theme glitch? Can you comment please?
We are sorry but that is a theme design. On desktop, it displays the menu items horizontally at the top of your Account page, rather than vertically. This will make you have bigger space to show the order details.
