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

Live view when using a CDN for CSS and JS

New Here ,
Mar 13, 2024 Mar 13, 2024

Hello,

Perhaps a dumb question, but the live view in Dreamweaver is not rendering content correctly for me becuase, I think, I am using a CDN for my Bootstrap CSS. When I open my page in Dreamweaver, there are three tabs- one for the html, one for bootstrap.min.css, and one for bootstrap.bundle.min.js. In the bootstrap css and js tabs, there is a single line "Invalid URL. The URL structure is /npm/package@version/file.js" Is there a way to get the live view to work when linking to a content delivery network?

 

Thanks much for anwering my noob question.

Chris

539
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 , May 14, 2024 May 14, 2024

You're in Design View, not Live View. 

Use Ctrl/Cmd + Shift + F11 to toggle between Design & Live view.

 

F12 Preview in Browser. 

Are you able to see styles from your local browser?

 

 

 

 

Translate
Community Expert ,
Mar 13, 2024 Mar 13, 2024

Thes are the correct links:

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
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
New Here ,
May 14, 2024 May 14, 2024

Thank you, I copied those files. I was using a 5.3.0 distribution, so that is now updated. The new links however did not resolve the problem with live view.

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 ,
Mar 14, 2024 Mar 14, 2024

Which version of Dreamweaver?  Help > About Dreamweaver.

 

Is this what you see when you click on the Bootstrap tabs? 

image.pngexpand image

 

Even if you could access the remote files, Bootstrap should never be edited by inexperienced users.  If you need to make custom changes, use a separate custom stylesheet that's saved to your local site folder and referenced below Bootstrap CSS.

 

If you're still not seeing an accurate display in Dreamweaver, see screenshot.   Hit F5 (function key) to refresh your screen.

image.pngexpand image

 

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
New Here ,
May 14, 2024 May 14, 2024

Yes, that is close to what I see. Refreshing related files did not help. I am attaching a screenshot of what I see in dreamweaver, that live view is obviously not using the bootstrap css that is linked. I updated the links that BenPleysier provided. Still no luck rendering correctly.

Thanks for any additional help!

Chris

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
New Here ,
May 14, 2024 May 14, 2024

Oops, here is the screenshot.

 

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 ,
May 14, 2024 May 14, 2024

You're in Design View, not Live View. 

Use Ctrl/Cmd + Shift + F11 to toggle between Design & Live view.

 

F12 Preview in Browser. 

Are you able to see styles from your local browser?

 

 

 

 

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
New Here ,
May 14, 2024 May 14, 2024

Oh my goodness. That worked! Thank you!

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 ,
May 14, 2024 May 14, 2024
LATEST

Glad to hear it!  You're welcome.

 

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