Home>Support>PB – add a picture to be responsive

PB – add a picture to be responsive

Hi, I use PB (which is really a good tool) in Vantage theme and I have some issues. – http://www.compleatadvice.com/services/stress-relief/

1, If I add a visual editor widget and I would like to add a picture and some text in the same line (box), picture will not be inserted as the original size. If I change the size of the picture after inserting it, it won’t be responsive any more. If I put it in the middle in visual editor, it will not be in the middle on live site.

2, I am also using tinymce widget and I have an issue with the text. If I don’t use the ‘automatically add paragraph’ than I can not format the text box, but if I am using it, by each ‘enter-new paragraph’ text will be in new box. and I need to delete each manually in html view.

3. If I use PB to add a contact form (text widget) and a picture next to it (picture widget). It will be repsonsive but with bigger margin

Can you please let me know how can I fix this issues?

Thanks for your help in advance.

URL: http://www.compleatadvice.com/services/stress-relief/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 8 years, 21 days ago Andrew Misplon Hi, I Work Here

    Hi P P

    Thanks for your support and feedback.

    1. When you add an image in the Visual Editor widget, are you setting Size to Full Size under ATTACHMENT DISPLAY SETTINGS on the bottom right of the Add Media window? Setting Alignment to Right or Left should ideally sort this problem of text and image on one line.

    2. Sorry, I’m not following you here. Please can you try explain further.

    3. You’ll either need to add three Page Builder rows instead of two or consider adding the image into the same widget as the contact form.

    Part of the margin that you’re seeing here is in the image itself. there is transparent space around the actual image.

  2. 8 years, 21 days ago Andrew Misplon Hi, I Work Here

    On question 1. Another option is to add two Page Builder columns in a row and add your image to one and the text to another. This will work responsively, the widgets will stack vertically below a certain breakpoint.

  3. 8 years, 19 days ago P P

    Hi, thanks for your reply.

    Regarding 1. question. Sorry if I was not clear. (“in one row”-in one PB column. I would like to use picture in the text as you can see now on stress-relief site. In that case the picture is unfortunately not responsive.

    If I would use different columns – eg. vertically different one for the picture – it would be too complicated as there will be more pictures in the text like the first one.

    2. question: solved

    3. If I would add 3 columns in that case third one would be empty and too big space on mobile screen btw picture and contact circle icons.

    Thansk for your help in advance.

  4. 8 years, 18 days ago Andrew Misplon Hi, I Work Here

    Glad to hear you’re making progress.

    Between the Image (PB) and the Visual Editor widget I’m unfortunately not sure there is much more I can offer here. Did you find my notes on size helpful? You mentioned how the image via the Visual Editor widget wasn’t getting inserted at full size and I mentioned checking those settings on insertion.

    Another option is our more advanced image widget found in our widget bundle plugin:


Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More