Bootstrap and Dreamweaver

Report · Feb 23, 2018

I’ve about given up with DW CC2018 as it relates to boot strap.

CC2018 Navbar Menu Code does not work when you test in a browser. The Drop down menus won’t toggle or collapse. I found Nancy O drop down menu works until…….I save in the html page. CC2018 rewrites the header information. What good is a web site with a menu?

If I, for example, put a grid row container in the body and save the result is the same. CC2018 will rewrite the code it wants/needs.

This is not a short time problem. This is CC2017 through CC2018that I have the same issues. especialli mthe dropdown menus. Adobe has not fixed the problem. Any suggestions/help would be appreciated.

Joe

Report · Feb 23, 2018

Can you give a sample of the code that is being rewritten by DW?

Show a before and the after sample. The only time I can think DW will do this is if you have not defined a site correctly at the outset of your project.

Report · Feb 23, 2018

Yes. I get that alot. about site not being defined correctly. But before CC i never got that type of error message. I've spent countless hours trying different combos.

Nancy O menu after being required to save:

<!doctype html>

<head>

<title>Bootstrap 3.3.7</title>

BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<style>

body {padding-top: 55px}

</style>

</head>

<body>

<div class="navbar-header"> <a class="navbar-brand" href="#"> BRAND NAME or LOGO </a>

</div>

<li class="active"><a href="#">HOME</a></li><li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown <span class="caret"></span></a>

<li><a href="#">submenu 1-1</a></li>

<li><a href="#">submenu 1-2</a></li>

<li><a href="#">submenu 1-3</a></li>

</ul>

</li>

</ul>

</div>

</nav>

crossorigin="anonymous">

</script>

Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

</body>

</html>

</button>

A page I made using CC2018 code Just a drop down menu:

<!doctype html>

<html>

<head>

<title>Untitled Document</title>

<!--[if lt IE 9]>

<![endif]-->

</head>

<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#topFixedNavbar1" aria-expanded="false"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button>

<a class="navbar-brand" href="#">Brand</a></div>

<li class="active"><a href="#">Link<span class="sr-only">(current)</span></a></li>

<li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown<span class="caret"></span></a>

<li><a href="#">Action</a></li>

<li><a href="#">Another action</a></li>

<li><a href="#">Something else here</a></li>

<li><a href="#">Separated link</a></li>

<li><a href="#">One more separated link</a></li>

</ul>

</li>

</ul>

</div>

<button type="submit" class="btn btn-default">Submit</button>

</form>

<li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown<span class="caret"></span></a>

<li><a href="#">Action</a></li>

<li><a href="#">Another action</a></li>

<li><a href="#">Something else here</a></li>

<li><a href="#">Separated link</a></li>

</ul>

</li>

</ul>

</div>

</div>

</nav>

</body>

</html>

Report · Feb 23, 2018

nc_joe@bellsouth.net wrote
CC2018 rewrites the header information.

Start with a newly defined site folder. Example, C:\MyTestSite\

Go to File > New > Starter Templates > Bootstrap Templates. Choose a layout and hit Create button. Save document as index.html.

DW creates appropriately linked assets folders and files for you.

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Report · Feb 23, 2018

I did as yoyou asked. Its telling me my site is not right! Outside the

root.

On Fri, Feb 23, 2018 at 12:20 PM, Nancy OShea <forums_noreply@adobe.com>

Report · Feb 23, 2018

See message I sent with previous emaIL.

Too summerize: When creating new site it tells me my site is out side the

root!

Joe

On Fri, Feb 23, 2018 at 12:20 PM, Nancy OShea <forums_noreply@adobe.com>

Report · Feb 23, 2018

nc_joe@bellsouth.net wrote
See message I sent with previous emaIL.
Too summerize: When creating new site it tells me my site is out side the
root!
Joe
On Fri, Feb 23, 2018 at 12:20 PM, Nancy OShea <forums_noreply@adobe.com>

So just to go through this. You create a folder and give it your site name, example on your desktop. You open DW and define the site (browse out to the desktop and choose the folder you created) and want all of your websites components to be saved in.

Is that how you are intially defining your new project or any project come to that?

Report · Feb 23, 2018

yes I created the folder first. And was able to create a starter template

page.

But it did not have a toggle collapse drop down. I need dropdowns. I made

a new page and added a nav bar. Saved it. They wanted to update

bootstrap. I let it. and got an error message. The two images are

enclosed.

Hope this helps.

Joe

Report · Feb 23, 2018

Yes that worked. However, I still have problems. See email with images.

Need Drop down menus.

Thanks.

Joe

Report · Feb 23, 2018

nc_joe@bellsouth.net wrote
Yes that worked. However, I still have problems. See email with images.
Need Drop down menus.
Thanks.
Joe

Have you gone through the documentation below?

Design responsive websites using Bootstrap

I seem to remember a post some time ago saying the program changed or wanted to change Boostrap related files but cant remember if the OP ever solved the issue.

Report · Feb 24, 2018

I glanced through that page. Nothing about drop down menus. pretty sure

I'm doing it right. They don't work> Tomorrow I hope to see if it works

live. I would have hoped the problem would havr been solved once Adobe

started using bootstrap 3.7

Thanks for your help.

Joe

Report · Feb 23, 2018

#1 You're using email to reply to this forum and we cannot see attachments sent from email. Please use the web forum to post screenshots or code. Don't use email.

#2 I see multiple references to Bootstrap CSS, Bootstrap JS and jQuery in your code. You should have only 1 reference to each of the core code libraries in this order:

Bootstrap CSS
jQuery JS
Bootstrap JS

The following code uses BS and JQ on CDNs. I'm doing it this way because I don't know what your Assets files are named in your local site folder.

<!doctype html>

<head>

<title>Untitled Document</title>

</head>

<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#topFixedNavbar1" aria-expanded="false"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button>

<a class="navbar-brand" href="#">Brand</a></div>

<li class="active"><a href="#">Link<span class="sr-only">(current)</span></a></li>

<li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown<span class="caret"></span></a>

<li><a href="#">Action</a></li>

<li><a href="#">Another action</a></li>

<li><a href="#">Something else here</a></li>

<li><a href="#">Separated link</a></li>

<li><a href="#">One more separated link</a></li>

</ul>

</li>

</ul>

</div>

<button type="submit" class="btn btn-default">Submit</button>

</form>

<li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown<span class="caret"></span></a>

<li><a href="#">Action</a></li>

<li><a href="#">Another action</a></li>

<li><a href="#">Something else here</a></li>

<li><a href="#">Separated link</a></li>

</ul>

</li>

</ul>

</div>

</div>

</nav>

<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

</body>

</html>

This is how it looks.

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Report · Feb 25, 2018

Thanks all! I got it to work. Problem solved. I used Nancy O.

Interesting. It works using with what CC 18 code gives me. I think it has to do with how I set up Site. I created folder first. Then went to new site set up and browsed to this folder. I always used to go to new site and create the older all in one step. Learned that here, too!

Joe

Problem solved!!!!!!

Adobe Community

Bootstrap and Dreamweaver

1 Correct answer