Highlighted

Dreamweaver troubleshoot CSS and Accordion

New Here ,
Aug 15, 2018

Copy link to clipboard

Copied

Hi --

I'm completing a new website both to launch my business (after completing Adobe Certificate, not yet) and as an assignment for a course.  I've run into problems with the template and have flailed around trying to fix it in CSS and just made it worse.  (Am suspicious that an incipient Windows Update, robbing resources in the background, was causing dropped stitches in the knitting.) The zip file will be uploaded, and it includes a WordPad file showing some of what I still need to tweak and might forget -- the big things need no reminder.

Anyway, the Accordion is set up correctly so far as I can see, but it doesn't work.

The center article should fill the space between the accordion and the media icons, but I can't get it to format so it looks the same as Sidebar1 only wider.

I've found "csses" and plan to delete the unused CSS selectors, but don't want to do that until later, so it's a mess.  And all the code needs to be tidied up eventually as it's shameful now, but am working to a deadline and must do essentials first.

Well... I don't see any way to attach the zip.  Guess I'll upload the files.  Wonder if the zip can be downloaded from the url?  Let's find out.  Seems to work, and the zip will download.

Index of /15aug18-template-jrj

Adobe Community Professional
Correct answer by Nancy OShea | Adobe Community Professional

Remove the leading dots  and slash from Bootstrap and jQuery file paths.

Change this:

../css/bootstrap.css

To this:

css/bootstrap.css

Save and upload the CSS and JS folders to your server.

Views

699

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 troubleshoot CSS and Accordion

New Here ,
Aug 15, 2018

Copy link to clipboard

Copied

Hi --

I'm completing a new website both to launch my business (after completing Adobe Certificate, not yet) and as an assignment for a course.  I've run into problems with the template and have flailed around trying to fix it in CSS and just made it worse.  (Am suspicious that an incipient Windows Update, robbing resources in the background, was causing dropped stitches in the knitting.) The zip file will be uploaded, and it includes a WordPad file showing some of what I still need to tweak and might forget -- the big things need no reminder.

Anyway, the Accordion is set up correctly so far as I can see, but it doesn't work.

The center article should fill the space between the accordion and the media icons, but I can't get it to format so it looks the same as Sidebar1 only wider.

I've found "csses" and plan to delete the unused CSS selectors, but don't want to do that until later, so it's a mess.  And all the code needs to be tidied up eventually as it's shameful now, but am working to a deadline and must do essentials first.

Well... I don't see any way to attach the zip.  Guess I'll upload the files.  Wonder if the zip can be downloaded from the url?  Let's find out.  Seems to work, and the zip will download.

Index of /15aug18-template-jrj

Adobe Community Professional
Correct answer by Nancy OShea | Adobe Community Professional

Remove the leading dots  and slash from Bootstrap and jQuery file paths.

Change this:

../css/bootstrap.css

To this:

css/bootstrap.css

Save and upload the CSS and JS folders to your server.

Views

700

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
Aug 15, 2018 0
Adobe Community Professional ,
Aug 15, 2018

Copy link to clipboard

Copied

Sorru, I don't donwload files from untrusted sources.  It's nothing personal. 

The best way to get help here is to upload your page & assets to a TEST folder on your remote server.  We can examine the page with our browser developer tools to see what's cookin'.

Nancy O'Shea, ACP
Alt-Web.com

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...
Aug 15, 2018 1
New Here ,
Aug 15, 2018

Copy link to clipboard

Copied

I sent an email reply asking how to do an upload to Test, but it must not have worked, so I'm asking now while on the Forum.  To do that, do I just create a directory for these files named "Test" or is there more to it?

Further, a friend from home used his test program after I asked our fan group for help, and he found a bug in that DW template from the download from  Index of /15aug18-template-jrj   ; I will meet with him tomorrow to discuss this, as we're both attending the WorldCon in San Jose.

It's a relief to know that I wasn't doing anything wrong, but that there actually was a bug, as I suspected.  Don't yet know how to deal with it -- probably start with a backup file from before the corruption and redo that last day.  Won't give me back all the time I wasted flailing around, though.

So is it worth your time to take a look as well, once I find out how to do this Test upload thing?

Thank you for your help.

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...
Aug 15, 2018 0
Adobe Community Professional ,
Aug 16, 2018

Copy link to clipboard

Copied

TESTING & DEBUGGIING

  1. Open your Files Panel (F8).
  2. Right click on your local site folder and select New Folder.
  3. Name it TEST.
  4. Copy your problem page and assets to the newly created TEST folder.
  5. Upload  TEST folder to your remote server.
  6. When your questions are answered, you may delete the TEST folder from your remote server.
Nancy O'Shea, ACP
Alt-Web.com

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...
Aug 16, 2018 0
New Here ,
Aug 16, 2018

Copy link to clipboard

Copied

Ok I'll do that but need directions about test folders.  Just name the folder test is all?

Get Outlook for iOS

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...
Aug 16, 2018 0
Adobe Community Professional ,
Aug 15, 2018

Copy link to clipboard

Copied

If this is your site, jj-INK - Home, please tell is where the accordion has been placed and what it is supposed to do.


Ben

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...
Aug 15, 2018 0
New Here ,
Aug 15, 2018

Copy link to clipboard

Copied

No, that's not the site I'm doing now; the jj-ink is from older college class projects but the uploading got scrambled for  jj-INK - Home  and I'll clean all this up on the host site when I have more time.  You've been doing some detective work to find that.  I don't actually have a home page for this new project yet, as I'm still working on the template, which can be downloaded from --  Index of /15aug18-template-jrj 

Further, a friend from home used his test program and found a bug in that DW template from the download; I will meet with him tomorrow to discuss this, as we're both attending the WorldCon in San Jose.  It's a relief to know that I wasn't doing anything wrong, but there was a bug.  Don't yet know how to deal with it -- probably start with a backup file from before the corruption and redo that last day.  Won't give me back all the time I wasted flailing around, though.

Thanks for taking an interest.

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...
Aug 15, 2018 0
New Here ,
Aug 17, 2018

Copy link to clipboard

Copied

OK, many thanks.  Files are in Index of /TEST

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...
Aug 17, 2018 0
Adobe Community Professional ,
Aug 17, 2018

Copy link to clipboard

Copied

That's not quite what I was hoping for.  We just need to see a working page online.  I don't want to download and unzip anything.

Nancy O'Shea, ACP
Alt-Web.com

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...
Aug 17, 2018 0
New Here ,
Aug 17, 2018

Copy link to clipboard

Copied

OK, I uploaded the css and js files, except I haven't found the font-awesome, but don't believe you'll need that.  There's an image in the fixup file of the DreamWeaver open to the present DWT and you can see the subsidiary files.  So you should have a working page when you put them all together with the css files in that director and js files in theirs.  Image won't show; do you want me  to upload that too?  Forgot.

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...
Aug 17, 2018 0
New Here ,
Aug 17, 2018

Copy link to clipboard

Copied

OK, realized I could put them into subdirectories and have done so.

Index of /TEST

Apache Server at www.jj-webdesign.com Port 80

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...
Aug 17, 2018 0
Adobe Community Professional ,
Aug 17, 2018

Copy link to clipboard

Copied

Don't you have a working .html page?

To give you an example of what I mean, this is a demo I created yesterday.  It's a working web page -- nothing to download, no assembly required.

Alt-Web Demo :: Responsive Masonry Gallery

Nancy O'Shea, ACP
Alt-Web.com

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...
Aug 17, 2018 0
New Here ,
Aug 17, 2018

Copy link to clipboard

Copied

OK, I finally got it to come up after I created a page from the faulty template.

jj-WebDesign — Let's make it right.

My friend emailed that he found a bug using the first set of files I sent, from the zip, and now we're both at the same convention in San Jose, WorldCon76, but he never followed up to tell me what to do about fixing anything, or what I should do, and I haven't seen him.  The deadline for this submission is tomorrow.

Thank you for any help you can offer.

Judy

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...
Aug 17, 2018 0
Adobe Community Professional ,
Aug 18, 2018

Copy link to clipboard

Copied

Please upload the JS folder containing Bootstrap and Jquery.js.  Those essential files are 404 not found on server.

Nancy O'Shea, ACP
Alt-Web.com

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...
Aug 18, 2018 0
New Here ,
Aug 18, 2018

Copy link to clipboard

Copied

If you look at the earlier replies, it's all there in the Notes directory.  And when I open http://www.jj-webdesign.com/TEST/home.html from my tablet, it is fine and doesn't need anything further.

Guess I should just despair.

[Personal info removed by moderator.]

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...
Aug 18, 2018 0
Adobe Community Professional ,
Aug 18, 2018

Copy link to clipboard

Copied

Then your web page contains bad paths to those 2 essential scripts.    When I view your source code in my browser and click on the jQuery script, this is what I see.  Ditto for the Bootstrap script.

Nancy O'Shea, ACP
Alt-Web.com

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...
Aug 18, 2018 1
New Here ,
Aug 21, 2018

Copy link to clipboard

Copied

Actually they are if you look at all the stuff I've already uploaded to test.

Get Outlook for iOS

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...
Aug 21, 2018 0
Adobe Community Professional ,
Aug 21, 2018

Copy link to clipboard

Copied

If those scripts are indeed on your server, they are in the wrong folder relative to your HTML page.  This is the path your page was pointing to (I see it is no longer there).

http://www.jj-webdesign.com/TEST/js/jquery1.11.3.min.js

Nancy O'Shea, ACP
Alt-Web.com

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...
Aug 21, 2018 1
New Here ,
Oct 16, 2018

Copy link to clipboard

Copied

Hi Nancy; I was reading this post because my bootstrap files template is not working either.

Curious, where exactly should the script files live. When I uploaded my bootstrap template to my server I checked "yes" to move dependent files. I assumed it would know where to put them 🙂  However, my responsive design is not working. I was thinking that maybe these files are not in the right place. Could you take a peak to see if they are correct?  Thank you.

My home page is:

http://www.afpdesign.com

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...
Oct 16, 2018 0
Adobe Community Professional ,
Oct 16, 2018

Copy link to clipboard

Copied

Remove the leading dots  and slash from Bootstrap and jQuery file paths.

Change this:

../css/bootstrap.css

To this:

css/bootstrap.css

Save and upload the CSS and JS folders to your server.

Nancy O'Shea, ACP
Alt-Web.com

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...
Oct 16, 2018 1