Node content displays horizontal, not vertical

Created on 7 June 2023, over 1 year ago
Updated 27 June 2024, 6 months ago

Problem/Motivation

Using drupal Paragraphs & Layout Paragraphs, when a user adds multiple paragraphs, the editor displays them in vertical sequence (stacked). But when viewing the saved content node, the paragraphs are tiled horizontally. I like and would expect the layout in the editor to be the same as the viewed output.

Steps to reproduce

Create a Layout Paragraphs, and a Paragraph type.
Create content type or modify existing content type to include the layout paragraphs.
Create new content and add a 2 or more sections <-- While still in editing mode, these will display as vertically stake content. The desired layout.
Preview the content
The paragraphs will display side-by-side, horizontally. <-- the undesired layout.

πŸ’¬ Support request
Status

Closed: works as designed

Version

2.0

Component

Miscellaneous

Created by

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @amw5g
  • Assigned to flashwebcenter
  • Status changed to Closed: works as designed over 1 year ago
  • πŸ‡ΊπŸ‡ΈUnited States flashwebcenter Austin TX

    Hello,
    The w3css theme is not for admin users (editor display) it is for regular users (viewing the saved content). Drupal has some themes built for admin users as Claro in Drupal core. I recommend using an admin theme and allow the editor in the permissions to view it.

    Go to your-site-dot-com/admin/appearance
    and scroll to the bottom under "Administration theme" and select Claro.

    Go to your-site-dot-com/admin/people/permissions
    and search for "View the administration theme" then enable this option for editor role.

    I am using https://www.drupal.org/project/gin β†’

    Best wishes,
    Alaa

  • Mmm, OK, fair. I hadn't considered that the theme wasn't intended for users in an Editor role. That helps. And I'll keep it in mind for future expectations.

    Given that I'd like the layout to be vertical instead of horizontal when viewing, do you have any hints as to where I should start? I suspect that there's *something* I can change in the CSS to do that. Or do you advise against that?

    I should have started by thanking you for the work on this theme & support; it's great to see someone put in so much valuable effort out of their respect for the community. I'm beyond impressed and appreciative.

  • πŸ‡ΊπŸ‡ΈUnited States flashwebcenter Austin TX

    Thank you! If this is a multi field you can use a quick custom css class I have in the theme settings. your-site-dot-com/admin/appearance/settings/drupal8_w3css_theme and click on "Advanced Site colors" then go to "To Disable" and copy "w3-expand-fields"
    and insert it in "Page Wrapper" text field.

    If it is not working then you can apply some CSS in two ways:
    1- Create a custom sub-theme ( https://www.drupal.org/node/2866181#d8w3css-sub-theme β†’ ) and add the css in the styles.
    2- Install this module ( https://www.drupal.org/project/asset_injector β†’ ) and inject the css.

    Best wishes,
    Alaa

  • πŸ‡ΊπŸ‡ΈUnited States flashwebcenter Austin TX
Production build 0.71.5 2024