Skip to content

Customize drag and drop content on mobile devices

Last updated: January 19, 2023

Applies to:

All products and plans

In theme templates, starter templates, and coded templates with drag and drop areas, you can hide specific modules on mobile devices, or add mobile-only margins and padding. Your page content itself can only be edited in the desktop version of the editor. 


Please note: only default HubSpot themes and some marketplace themes include mobile editing - custom themes do not include mobile editing by default. To implement mobile editing, HubSpot recommends that you work with a developer to install mobile breakpoints.

  • Navigate to your content:

    • Website Pages: In your HubSpot account, navigate to Marketing > Website > Website Pages.
    • Landing Pages: In your HubSpot account, navigate to Marketing > Landing Pages.
  • Hover over your page and click Edit.
  • In the top left of the sidebar editor, click the mobile Edit for mobile icon. 

edit-page-content-for-mobile

  • Click a module to customize how it appears on mobile devices.
  • To display or hide this module on mobile devices, click the Visibility section, then select Show or Hide. Hidden modules will still appear on the desktop version of the page. 
  • To edit this module's spacing on mobile devices, click the Alignment and spacing section, then select Padding or Margin. Enter pixel values in the Top, Left, Right and/or Bottom fields. 

edit-alignment-on-mobile

  • To select another module, click Back in the upper left.
  • To return to the desktop editor, click the desktop Edit for desktop icon in the upper left. 
Was this article helpful?
This form is used for documentation feedback only. Learn how to get help with HubSpot.