Simply select a color variant and save your page. When adding or editing a the paragraph in a content or block type, you wou will see that you can set a background-color, using a colored preview (colored squares with an 'a' in them).Įach of those squares matches a color variant that is provided in the config form. Default paragraph type: Simple header, for the header paragraphs.Recommended settings in 'Manage form display': Be sure toĮxclude header paragraphs from these field instances. Be sure to only allow paragraphs of this type for theĪll other paragraphs are simply pre-made paragraphs. Used in lieu of the standard title, these paragraphs addīackground color, background image, title override (with support for limited field_paragraphs: for all other Paragraphs.field_header_paragraph: for header Paragraphs.
Type or block, be sure to re-use the existing fields: So when adding paragraphs to a new content When installing rocketship_paragraphs, it will add a whole lot of paragraph styles for you to use in your content types (or block types).Ī lot of the theming and logic is tied to certain fields we've already set up,Įither here or in Rocketship Core. It is recommended to also copy and use the file, as it creates column structures that some of the paragraphs use. Jumping-off point if you want to write your own, where you can replace colors and classes (names starting with 'replace variant') There are 2 dummy CSS-files included in css/templates. You're already planning on creating custom theming, this may be preferential.Ĭombining is also possible, as the hook is a simple alter. You can also remove the variations and instead just declare them in a hook. In that case, do not enable the default CSS option and instead add theming for the variations you've added in your custom theme. Perhaps there are styling exceptions that have to be taken into account.
This file is only loaded if you enable the default CSS. it will generate a CSS file that can apply these colors to your paragraphs.Here you can define sets of colors for your front-end theme to use.Įach color set (or 'variant') consists of: But only if your site has no sidebar and the page container doesn't have overflow:hidden on it You can make the paragraph backgrounds stretch the width of your site.
This loads a generated CSS file which automatically applies your chosen colors (see 'color variants' explanation further below). If you do not use the Rocketship themes, you can start from the CSS files in the css/examples-folder. In those cases, it is better to roll your own. It is recommended you do not use this if you are using one of the Rocketship themes or customized designs. This loads structural CSS (basic layout such as columns where needed). admin/config/system/rocketship-paragraphs
COLOR YOUR OWN ROCKETSHIP HOW TO
1.8.x (do not use 1.9, it breaks things)įollow the READMEs for those modules on how to properly download these You will need these JS libraries installed in your project: More explanation about each type of paragraph can be found at our help center: Libraries
COLOR YOUR OWN ROCKETSHIP INSTALL
Works best with Dropsolid Rocketship Install Profile.Ī collection of paragraphs to kickstart your development, used by Dropsolid. Please refer to the latest version of Rocketship, using Layout Builder instead (5.x). The version of Rocketship that works with Paragraphs is no longer actively maintained.
0 kommentar(er)
