Problem with custom panel

  • 1
  • Problem
  • Updated 4 years ago
  • Not a Problem
Hi Yola team,

I've been experiencing a major problem with the custom panel widget for the last few days. Whenever I try to add anything to it (such as a column divider or photo) I get a strange overlap of the item I'm adding and it doesn't appear to fit into the custom panel. I have to keep refreshing the page to make it disappear which is making my site extremely difficult to edit. This is happening on all pages of my website http://www.simplyeighties.com. I have cleared my cache and reinstalled Java but this makes no difference. Hope someone can help.
Photo of Mark N

Mark N

  • 466 Posts
  • 30 Reply Likes
  • frustrated

Posted 4 years ago

  • 1
Photo of Mark N

Mark N

  • 466 Posts
  • 30 Reply Likes
Hello, is anybody out there?
Photo of Laura Thomas

Laura Thomas, Social Media Coordinator

  • 4536 Posts
  • 211 Reply Likes
Hi Mark,

What browser are you using, or is this happening across all browsers? Also can you reply with a screenshot of what's happening. We'll see if we can replicate it in one of our accounts.
Photo of Mark N

Mark N

  • 466 Posts
  • 30 Reply Likes
Photo of Mark N

Mark N

  • 466 Posts
  • 30 Reply Likes
Hi Laura,

The problem is occurring in Chrome and Firefox, although I haven't tried Internet Explorer as I don't use it. I have used the home page as an example for the screenshot I've posted separately. On the top right I have tried to add the two T-shirt images to a white customer panel and you can see the overlap. When I refresh the page the overlap disappears, but to edit a large page of products (of which I have quite a few) it becomes almost impossible to edit.
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hello Mark

Thank you for your screenshot. I've logged into your Sitebuilder to check things further. I think the cause for the problem you have is that the picture elements you added onto the Custom Panel exceed the width of the right layout column. When you look closer in workview, you'll see that the red-dotted line of the right-hand side column of the layout you chose has been extended far into the background picture. In Preview I can see that the distance from the T-shirt pictures to the right-hand side of the white content background is much smaller than on the left-hand side. The T-shirt pictures are too wide for adding them to that place of your page. This is why it starts messing with the view of your Custom Panel and the T-shirt pictures themselves at first, and gets a little bit corrected after refresh, though still not ideal.

So I'd suggest that you either reduce the width of your T-shirts picture, or change the two-column layout to a one column layout and add your columns using the Column Divider Widget. This will give you more layout flexibility on your pages.
Photo of Mark N

Mark N

  • 466 Posts
  • 30 Reply Likes
Hi Stefan,

The issue I'm having is actually with the overlap at the bottom of the custom panel, and I was just using the home page as an example. This is happening on every page of my site and making it extremely hard to edit. If you were to add a custom panel to any part of the page and drag those T-shirts onto it you should see the problem, unless it's a problem only my computer is having and then you won't, of course!

The problem disappears when you refresh the page, but then I have to refresh the page each and every time I add a custom panel, and on some pages I need to add lots of them which is a nightmare at the moment.
Photo of Mark N

Mark N

  • 466 Posts
  • 30 Reply Likes
I just want to mention that this question been marked as "no problem", but the problem remains! If I place a customer panel anywhere on any page of my site and then add or drag a photo onto it I get overlap at the bottom.and then it becomes almost impossible to add anything else to the panel until I refresh the page.

At the moment I am unable to create new pages of products which I need to place into individual panels, and refreshing the page each time I add one product is just too time consuming and frustrating. I hope this can be solved soon. Thank you.
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hello Mark

I've looked into this for you again. I can replicate the issue you're reporting when I use your T-Shirt pictures. However, when I add a Custom Panel Widget anywhere on your page and put a Picture Widget onto it, then select an uploaded picture from your File Manager, the Custom Panel automatically adjusts just fine.

I noticed that your T-shirt pictures are displayed through URLs which you added to HTML Code Widgets. It looks like the problem is that the Custom Panel Widget cannot read the height of the pictures straight away because they're not added via the Picture or Picture Gallery Widget. That's why you need to refresh workview first. You'll encounter this problem especially with the HTML Code Widget because any code defining any dimensions of an element can be added to it, so that it's difficult for the Custom Panel Widget to adjust straight away, and it can only do so after a page refresh as soon as it can read the dimensions of the element added.

I'm sorry if refreshing workview causes you an inconvenience, however, it's the only way to view the correct layout in this case at the moment.
Photo of Mark N

Mark N

  • 466 Posts
  • 30 Reply Likes
Hi Stefan,

Thank you for the reply. Well, at least I know what the problem is now. Thank you, I will just have to keep refreshing the page. The only solution, I guess, would be to download and edit each photo I need and link to them at Amazon (which is what I used to do before Amazon started allowing larger photo links), but this is even more time consuming so I'll stick to just HTML code. Thanks again.