Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

Can DW use CSS classes when <link> not on current page?

Community Beginner ,
Jan 30, 2017 Jan 30, 2017

In a twig based bootstrap site I'm assisting with I keep having to add the link to the boostrap core css on each twig file temporarily while I'm making changes to it and then remember to delete the link else DW does not pick up the classes to assist me with completing them.  Is there a way to make dreamweaver always load and assist with BootStrap css classes without having to include that <link>  in the current page?

500
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Jan 30, 2017 Jan 30, 2017

As Nancy has said, there is no way to have a document to refer to a style-sheet without physically attaching the style-sheet to the document.

To assist with the process that you are asking about, make a snippet that attaches a CDN-linked* style-sheet. You will have to remember to detach the style-sheet prior to uploading.

* <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vb

...
Translate
Community Expert ,
Jan 30, 2017 Jan 30, 2017

Where do you normally reference your CSS?  Is it in an include file?

Nancy

Nancy O'Shea— Product User, Community Expert & Moderator
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 30, 2017 Jan 30, 2017

The CSS is included in the top level of the templates which are inherited by the site when it renders, however the source code for each twig file does not include it.  So in order to have DW "know" that the css classes are available to me I need to keep remembering to copy/paste the links to the css while I'm editing and then deleting them once I'm done else multiple references to the css will appear in the rendered code.

For instance a page I have open right now has the below code which is the starting block for the user profile page where I need to put the form in. The app_public_template.twig file renders the css for the site as well as the main template information and in order for my dreamweaver to autocomplete the classes while working on this file I need to include a <link> temporarily to the css and then remember after I'm done to delete it.  Later if I need to make an update, I once again need to remember to put and remove the <link> or alternatively I put in a "Never run this" if/end statement around the code so that  it's always there but never renders to the client but then it's leaving confusing junk behind for other developers many of which aren't using dreamweaver and don't get why I would leave this code behind for them.  I've exampled that method below and bolded it in red. Optimally I would like to have this not be required but instead tell DW "By default always use these classes as options for autocompletion even if the CSS is not linked."

{% extends 'layouts/app_public_template.twig' %}

{% block title %}User profile for {{user}}{% endblock %}

{% block content %}

  <div class="row">

  </div>

{% if 1==2 %}<link rel="stylesheet" href="/css/bootstrap.min.css">{% endif %}

{% endblock %}

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 30, 2017 Jan 30, 2017

I don't work with Twig templates.  I can't think of a workaround at the moment.


Nancy

Nancy O'Shea— Product User, Community Expert & Moderator
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 30, 2017 Jan 30, 2017

As Nancy has said, there is no way to have a document to refer to a style-sheet without physically attaching the style-sheet to the document.

To assist with the process that you are asking about, make a snippet that attaches a CDN-linked* style-sheet. You will have to remember to detach the style-sheet prior to uploading.

* <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Feb 01, 2017 Feb 01, 2017
LATEST

Per my initial snippet - I suggest anyone resorting to that keep it wrapped in an IF statement so as to not accidentally have it re-included should the file be implemented with the style included.

With more and more systems out there where the template/css are so disconnected from the code snippets we are working on I hope that someone at Adobe reads this thread and realizes how useful the ability to force-load a set of common css into our editor could be.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines