Home>Support>Page Builder By SiteOrigin – My row editing is not working

Page Builder By SiteOrigin – My row editing is not working

Hi

I wish to edit my website to be mobile responsive as per below video:

Please let me know as I can’t see the row editing features when I go to Page Builder live editing.

Thank you so much in advance!

Zohra Lakhani

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

  1. 7 years, 9 months ago Alex S
    Hi, I Work Here

    Hi Zohra,

    Unfortunately, that video is making use of a different page builder rather than SiteOrigin Page Builder.
    I might be able to assist (as in tell you how, or provide you with minor CSS) you with any adjustments you need to make. Could you elaborate on what you would like to make responsive?

  2. 7 years, 9 months ago [email protected]

    Hi

    Thanks for your reply! Really appreciate it! : )

    I need to adjust my images to be responsive. Also, I wish to have more control over text wrap on mobile phone as some of my paragraphs are all over the place on mobile phone.

    I fixed the images through a plugin by SiteOrigin but by using that plug in, my paralax effect is gone …

    Please check my website and please guide: http://www.creativejoys.me

    *IMPORTANT PROBLEM:*
    *Also, I wish to hide some rows on mobile phone. I downloaded a plugin but
    I can only hide elements inside the row … on mobile phone, it does hide those elements but creates a lot of empty space. Which looks very bad. Is there any way please, I can hide rows on mobile and tablet viewing.*

    Take care!

  3. 7 years, 9 months ago Alex S
    Hi, I Work Here

    Hi Zohra,

    Sorry for the delay.

    Could you please clarify the plugin you used to make the images responsive? Also, could you please elaborate on what wasn’t responsive about them before? (for reference) I suspect the plugin used prevents parallax’s from working due to how it handles responsive images.

    As for the text wrap – that can be handled via CSS. Can you please clarify a location you would like to adjust?

    Yes. I personally would use CSS for this. Please open the relevant row you wish to hide on mobile / tablet by clicking the wrench icon above it. Then head over to the rows styles sidebar and open the Attribute settings group. Set the class to either tablet-hide or mobile-hide, if you wish to hide them on those specific devices or tablet-hide or mobile-hide and then navigate to WP AdminAppearanceCustom CSS and add the following CSS:

    .mobile-show {
    	display: none;
    }
    
    .tablet-show {
    	display: none;
    }
    
    @media (max-width: 599px){
    	.mobile-show {
    		display: block;
    	}
    
    	.mobile-hide {
    		display: none; 
    	}
    }
    
    @media (min-width: 600px) and (max-width: 1025px){
    	.tablet-show {
    		display: block;
    	}
    }
    
    
    @media (max-width: 1025px){
    	.tablet-hide {
    		display: none; 
    	}
    }
    

    You might also need to install the SiteOrigin CSS Editor.

  4. 7 years, 9 months ago [email protected]

    Hi Alex

    Thanks a million! The mobile-hide works for me and looks great now!

    – To fix the image responsiveness, I used SiteOriginImage widget on the rows I have images on. It has removed the paralax effect though (example:
    About Us page http://www.creativejoys.me/about-us/).
    – The text wrap looks poor on both mobile and tablet (overall on most of the pages)
    – If you don't mind, I also needed support with my home page image (
    http://www.creativejoys.me). I wish to have this image cover entire screen under all circumstances / sizes etc.

    ​Thanks once again!

  5. 7 years, 9 months ago Alex S
    Hi, I Work Here

    Hi Zohra,

    Okay so yeah, the SiteOrigin Image widget doesn’t support parallax – only widgets and rows do. This is sadly unavoidable.

    Regarding your homepage. Instead of using spacer, I would set an overall height via with vh – something like: height: 98vh; this will allow the image to display dependent on the height of the browser.

    Could you clarify what you would like to change specify? I can however state that you won’t be able to get the same level of control as you currently do unless you go via the “hide widgets not on X device” method (with the above provided CSS) as the way you’re currently doing things (creating exact line breaks via paragraphs) isn’t possible via CSS.

  6. 7 years, 9 months ago [email protected]

    Hi Alex

    Thanks for your prompt reply! Much appreciate it!

    Most of it looks sorted except text wrap. But its alright, for now its fine and workable.

    Thank you once again!

    Kind regards

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