Object Moving When Adding New Image - Question | JoomShaper
🎃 Halloween Sale is Live! Get 35% OFF on all plans. Sale ends soon! Get Offer

Object Moving When Adding New Image

PJ

Portia Jelwana-Schmidt

SP Page Builder 6 months ago

I wanted to add a logo as an image adding to the existing images. when doing so, all other items are moving down and even the row area is getting larger. Using the frontend editor it looks like here: www.test4.jelwana.net

I tried to add the image at different positions, but allways the same happens.

0
7 Answers
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 6 months ago #189449

Apologies for the inconvenience. Could you please share a screen recording of the issue? It will help me better understand what’s happening and provide you with an accurate solution. You can use files.fm to upload and share the recording.

Looking forward to your response.

Best regards

0
PJ
Portia Jelwana-Schmidt
Accepted Answer
6 months ago #189588

Hi Atick, thanks for your reply.

There are some basics, that I do not understand in SPPagebuilder: When I add an image to the column2, that within a row, that is within column1, which is the picture of the lady in column1 moved down? Also why is the row Y area enlarged so much and the headings moved down ? See www.test4.jelwana.net

Best regards Ralph for Portia

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 6 months ago #189609

Hi there!

To assist you more effectively, may I kindly request temporary administrative access to your site? This will allow me to thoroughly investigate and resolve the issue for you.

Before sharing the credentials, I strongly recommend taking a complete backup of your site to ensure all data remains secure.

Looking forward to your response.

Best regards

0
PJ
Portia Jelwana-Schmidt
Accepted Answer
6 months ago #189667

Hi Atick, below you will find the access data.

Please look at page home2(2), which I just made using the SPA template provided by PB. I then wanted to add a further image. This moved all pictures down which were not inside the row envolved.

Trying to use the frontend editor I noticed and do not understand:

  1. I could not move the positions of images be drag and drop as described in the PB manual
  2. Look at page 'home de' : Why are all items shifted below the image of the woman?
  3. At page 'home4' you see the templet SPA without any changes. All rows and colums are nicely nested within each other and all items are in place properly. What is different from my modified pages ?

Kind Regards Ralph for Portia

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 6 months ago #189701

Hi Ralph,

Thank you for sharing the access details and for your detailed message.

Apologies for the inconvenience you’ve experienced. I’ve checked your website, and everything currently appears to be displaying as designed.

It seems there may be a bit of confusion regarding the structure and behavior of the SP Page Builder addons. When adding or rearranging elements, especially outside of their original rows or columns, it's important to maintain the intended nesting structure—otherwise, layout shifts like the ones you described can occur.

I highly recommend reviewing our documentation on working with structure and layout for a better understanding of how to correctly use rows, columns, and addons: 🔗 SP Page Builder Structure Documentation

Kind regards

0
PJ
Portia Jelwana-Schmidt
Accepted Answer
6 months ago #189723

Thank you Atick,

your comments helped a lot. I revised the column and row structure of the template SPA in order to be able to add additional pictures without moving other contents.

I have one more question: For moving elements within a column there are two different possibilities with x and y values, 'transform' in the style tab and 'custom position' in the advanced tab. What is the diference between both?

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 6 months ago #189735

The difference lies in how they affect layout:

  • Transform (Style tab) moves the element visually without affecting its position in the layout. It's ideal for animations and fine-tuning spacing.

  • Custom Position (Advanced tab) changes the element's actual position using CSS positioning (e.g., relative or absolute), which can impact the surrounding layout.

Use Transform for visual shifts and Custom Position for structural placement.

0