Highlighted

Dreamweaver Template and Bootstrap Navbar

New Here ,
May 19, 2020

Copy link to clipboard

Copied

Hi all, I've got a site based on Dreamweaver templates.  The navigation is Spry Menu's embedded in the template .dwt file.

I'm hoping to update the menus using bootstrap, but I don't seem to be able to put bootstrap elements into the header regions of the .dwt.

 

What am I missing here?

Views

702

Likes

Translate

Translate

Report

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

Dreamweaver Template and Bootstrap Navbar

New Here ,
May 19, 2020

Copy link to clipboard

Copied

Hi all, I've got a site based on Dreamweaver templates.  The navigation is Spry Menu's embedded in the template .dwt file.

I'm hoping to update the menus using bootstrap, but I don't seem to be able to put bootstrap elements into the header regions of the .dwt.

 

What am I missing here?

Views

703

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
May 19, 2020 0
LEGEND ,
May 19, 2020

Copy link to clipboard

Copied

Why not, Bootstrap navbar is only html code. What's happening when you try and insert the html code into your template file?

 

Have you inserted all the required assets for Bootstrap into your page ie the css file and the 3 js files?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 19, 2020 0
New Here ,
May 20, 2020

Copy link to clipboard

Copied

In the template I've got a header, body and footer.

In the header I've got elements that are common to every page - logo, search tool, spry menu and a editable region where I just have the page title.

I want to add the Bootstrap NavBar to the header, and replace the Spry one.

I usually work in "Design" view. So I position the cursor, then Insert > Bootstrap Components > Navbar > Basic Navbar.....

Message comes up telling me to use Live view.... Cancel or OK.... Well OK then!

Live view opens - presuming the position is still correct, Insert > Bootstrap Components > Navbar > Basic Navbar........ But Basic Navbar is greyed out....

So it seems that to insert bootstrap components into the template you have to be in live view, but then the components are all greyed out....

But I just discovered that if I switch to code view it works.... Why does Dreamweaver push to Live View when it doesn't work?

Scott Young

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 20, 2020 0
Adobe Community Professional ,
May 21, 2020

Copy link to clipboard

Copied

Bootstrap + DW proprietary Templates is an awkward combination. 

 

Template options are not available in Live View.  Therefore you must use Design View when working within a Template.dwt file.   However, Bootstrap and Live View go hand in hand.  So the ideal workflow is to build your prototype page with Bootstrap in Live View BEFORE saving as a Template.  

 

Best advice, use server-side includes instead of templates.

https://alt-web.blogspot.com/2015/07/server-side-includes-with-php.html

 

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 21, 2020 0
New Here ,
May 21, 2020

Copy link to clipboard

Copied

Hi Nancy, thanks for that, but SSI seems to add a lot of complexity where templates are simple and intuitive.

Would it work for me to save a version of the template as HTML, do the bootstrap stuff, and then copy the code from that to the template file?

Scott.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 21, 2020 0
Adobe Community Professional ,
May 21, 2020

Copy link to clipboard

Copied

If you decide to go down that road, perform a test on a dummy Template first to see if it works OK.  Be careful about your path to assets as that all changes when document is saved as a .dwt in the Templates folder.

 

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 21, 2020 0
New Here ,
May 22, 2020

Copy link to clipboard

Copied

Thanks - good tip about the links, seems it is easy enough to make the Navbar without links, stick the code into the template, and then make the links from there - then bingo update all your pages.

Saves all the testing server stuff and random bits of code floating about!


Scott Young

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 22, 2020 0