Using Acquia Cohesion on an existing website
You can use Acquia Cohesion on an existing website to take advantage of it's page editing and page layout capabilities. When using Acquia Cohesion on an existing website there are a number of important aspects you should understand.
Responsive media queries (breakpoints) and responsive grid
Acquia Cohesion allows you to configure your websites responsive media queries (breakpoints) and website grid at Acquia Cohesion > Website settings > Responsive grid settings.
When using Acquia Cohesion on an existing website it's recommended that you match the settings within the Responsive grid settings to those set within your existing website theme. You can find more information about responsive grid settings here.
CSS styles for base elements
Your existing websites theme may include styles for base elements like <p>, <h1>, <blockquote> etc. For this reason, you should not use Acquia Cohesion's style builder found at Acquia Cohesion > Styles > Base styles to create base styles. If you do, these will override the base styles you have set in your theme and will affect the appearance of other pages on your website. You can find more information about base styles here.
You will still need to enable the Acquia Cohesion base styles module even if you do not use the base styles functionality.
Custom CSS classes
You can use Acquia Cohesion to create custom CSS classes at Acquia Cohesion > Styles > Custom styles. All styles created are prefixed with .coh-style to help prevent any clashes with classes in your theme's style sheet.
If you want to apply classes you've already defined within your existing website theme to Acquia Cohesion elements, you can apply them directly within the markup tab of the element. You can find more information about adding markup to an element here.
Adding the layout canvas to your content entities
You can use Acquia Cohesion's layout canvas on your existing content entities by adding the Layout canvas field. This is added in the same way as any other field within Structure > (Entity type) > (Bundle) > Manage fields. The layout canvas will render within the content region of the website. You can find more information about adding the layout canvas here.
Acquia Cohesion uses render placeholders of inline CSS and as these cannot be naturally injected into the HTML template, the site's theme needs to contain <cohesion-placeholder></cohesion-placeholder> within the <head> tag.
Creating and using page components
Acquia Cohesion's powerful page creation and editing experience rely on Acquia Cohesion components. These provide a flexible layout system for editors and site builders. You can think of them as mini templates that can be added and combined on the Layout canvas to create new layouts. You can create components at Acquia Cohesion > Elements > Components. You can find more information about creating and using components here.
Content templates for view modes
Acquia Cohesion includes a system for building content templates for View modes. When using Acquia Cohesion on an existing website you do not have to use Acquia Cohesion templates as your website theme will include these. However, you can create templates using Acquia Cohesion if you require at Acquia Cohesion > Templates > Content templates.
Any template suggestions created here will override any less specific templates within your website theme. Full view mode templates will render within the Content region of your website and other View mode templates will render where specified For example, within a Drupal view.
You can find more information about the types of template you can create with Acquia Cohesion here.
Deployment
Styles, Templates, Components and other "non content" assets created by Acquia Cohesion are stored as configuration. This means that they can be deployed to a production environment as configuration and not effect content. However, Acquia Cohesion allows you to create configuration with file dependencies. For example, you could create a Component which includes a default image.
For this reason, Acquia Cohesion includes the Cohesion sync sub-module that handles the deployment of configuration including file dependencies from one environment to another. You can find more information about Acquia Cohesion configuration management & deployment here.
Next steps
Once you've understood the above, you can follow the steps below to install and use Acquia Cohesion on an existing website
