HTML pages in Dreamweaver not showing in the content area

  • Resolved Johnny Bravo

    (@herbiehysteria)


    14 years, 11 months ago

    Hi
    I have created my wordpress pages in dreamweaver and have been copying and pasting the code into the Dashboard> Edit Pages> etc. First, i used tables to layout my HTML pages but there was a conflict with column sizing between IE and Firefox, so was advised to use DIVS to layout my pages, as it was more generic and faster-loading (apparently).

    So I used AP DIVS (AP = absolute positioning) with CSS rules to layout my pages. All is well accept when i copy and paste the html into my wordpress edit pages dashboard, the page appears fine but not within the content area of my theme. It appears exactly as it is previewed in the browser, but should be within the content area of my theme. (Is this something to do with the CSS rules? please help!)

    You can see the problem at https://www.artbyherbie.com/wptest

    BTW (the whole reason i am using DIVs and DW to layout my pages is because i wanted a ‘second sidebar’ which was just a ‘non widgetised column’ about 100px wide in which i could add anything i wanted: ie links, text, images etc). after much headscratching trying to edit my theme, i decided to use DIVS to create the content area and additional grey ‘column’.

    Your help is much appreciated.
    HH

Viewing 13 replies - 1 through 13 (of 13 total)
  • Thread Starter Johnny Bravo

    (@herbiehysteria)

    sorry, the link again: https://www.artbyherbie.com/wptest

    Validating your pages might have given you a clue. You cannot add a whole web page – complete with DOCTYPE and body tags – inside a WordPress page that already has a DOCTYPE and body tags.

    Thread Starter Johnny Bravo

    (@herbiehysteria)

    esmi im sure ur onto something there because when i created the pages with tables, i would copy only everything from the body tags onwards, leaving all the doctype etc out. this would make them align perfectly. what do i need to leave out on these pages.

    thanks for the quick reply ??
    HH

    You need to leave out everything except the core content of your pages. Even CSS shouldn’t be added within the page content area unless you’re using inline style.

    Thread Starter Johnny Bravo

    (@herbiehysteria)

    esmi
    ive validated and its ok. ive also got rid of all the doctype, body, html, style etc tags but when i do this, the content does go where its supposed to be but half my divs including the grey column totally disappear! i have added what i am pasting, the html in its entirety, please advise what needs to be omitted.

    thanks, again!

    <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”&gt;
    <html xmlns=”https://www.w3.org/1999/xhtml”&gt;
    <head>
    <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
    <title>Untitled Document</title>
    <style type=”text/css”>
    <!–
    #apDiv1 {
    position:absolute;
    width:500px;
    height:102px;
    z-index:1;
    left: 0px;
    top: 0px;
    background-color: #ffffff;
    margin: 0px;
    text-align: justify;
    }
    #apDiv2 {
    position:absolute;
    width:10px;
    height:102px;
    z-index:2;
    left: 500px;
    top: 0px;
    background-color: #FFFFFF;
    }
    #apDiv3 {
    position:absolute;
    width:115px;
    height:102px;
    z-index:3;
    left: 510px;
    top: 0px;
    background-color: #CCCCCC;
    }
    #apDiv4 {
    position:absolute;
    width:625px;
    height:10px;
    z-index:4;
    left: 0px;
    top: 103px;
    }
    #apDiv5 {
    position:absolute;
    width:500px;
    height:200px;
    z-index:5;
    left: 0px;
    top: 113px;
    text-align: center;
    }
    #apDiv6 {
    position:absolute;
    width:10px;
    height:600px;
    z-index:6;
    left: 500px;
    top: 113px;
    }
    #apDiv7 {
    position:absolute;
    width:115px;
    height:600px;
    z-index:7;
    left: 510px;
    top: 113px;
    background-color: #CCCCCC;
    text-align: center;
    }
    #apDiv8 {
    position:absolute;
    width:500px;
    height:200px;
    z-index:8;
    left: 0px;
    top: 313px;
    text-align: center;
    }
    #apDiv9 {
    position:absolute;
    width:500px;
    height:200px;
    z-index:9;
    left: 0px;
    top: 513px;
    text-align: center;
    }
    #apDiv11 { position:absolute;
    width:500px;
    height:200px;
    z-index:9;
    left: 0px;
    top: 513px;
    text-align: center;
    }
    #apDiv10 {
    position:absolute;
    width:625px;
    height:10px;
    z-index:10;
    left: 0px;
    top: 715px;
    }
    #apDiv12 {
    position:absolute;
    width:625px;
    height:97px;
    z-index:11;
    left: 0px;
    top: 726px;
    background-color: #ded5fa;
    }
    –>
    </style>
    </head>

    <body>
    <div id=”apDiv1″>Welcome to https://www.artbyherbie.com, the bespoke art and design service from renowned artist and designer,?Herbie Hysteria. Original design and quality craftmanship seperates Herbie Hysteria from the pretenders. Multi-talented and multi-skilled, we bring you something you may have difficulty in believing. But we’re here to help, so browse at your leisure.</div>
    <div id=”apDiv2″></div>
    <div id=”apDiv3″></div>
    <div id=”apDiv4″></div>
    <div id=”apDiv5″><img src=”https://www.artbyherbie.com/wptest/wp-content/themes/indezinerpaperwall/images/desprint.gif&#8221; alt=”Design and Print” width=”246″ height=”200″ /><img src=”https://www.artbyherbie.com/wptest/wp-content/themes/indezinerpaperwall/images/graphics.gif&#8221; alt=”Graphic Design” width=”246″ height=”200″ /></div>
    <div id=”apDiv6″></div>
    <div id=”apDiv7″></div>
    <div id=”apDiv8″><img src=”https://www.artbyherbie.com/wptest/wp-content/themes/indezinerpaperwall/images/webart.gif&#8221; alt=”Web Design” width=”246″ height=”200″ /><img src=”https://www.artbyherbie.com/wptest/wp-content/themes/indezinerpaperwall/images/custom.gif&#8221; alt=”Custom Printed Clothing” width=”246″ height=”200″ /></div>
    <div id=”apDiv9″><img src=”https://www.artbyherbie.com/wptest/wp-content/themes/indezinerpaperwall/images/signs.gif&#8221; alt=”Signs and Vinyl Graphics” width=”246″ height=”200″ /><img src=”https://www.artbyherbie.com/wptest/wp-content/themes/indezinerpaperwall/images/canvas.gif&#8221; alt=”Canvas Art” width=”246″ height=”200″ /></div>
    <div id=”apDiv10″></div>
    <div id=”apDiv11″></div>
    <div id=”apDiv12″></div>
    <p> </p>
    <p> </p>
    </body>
    </html>

    You can’t add an entire page into the content area of a WordPress page and expect it to work properly. You need to add content markup only to the WP page and then add your CSS to your theme’s stylesheet.

    Thread Starter Johnny Bravo

    (@herbiehysteria)

    i see, please elaborate on that esmi. from the above DW generated code, what do you class as ‘content markup’ and how do i ensure this is correct? i can understand cutting the CSS from the above code and putting that in my themes stylesheet.

    its not far off what it should look like, its just that evereything is flush against the screen area and not the content area. everything appears fine, its just the positioning so i appreciate your help ??

    thanks
    HH

    Everything from after the opening <body> tag down to the last closing </p> tag.

    Moderator Samuel Wood (Otto)

    (@otto42)

    www.remarpro.com Admin

    Wow. Okay.

    herbiehysteria: The short version is simple to understand:
    Stop using DreamWeaver.

    DreamWeaver is designed to make whole webpages. WordPress is also designed to do that, but WordPress does it for you. All you have to do is type in the basic, simple, text and WordPress handles the rest.

    Thread Starter Johnny Bravo

    (@herbiehysteria)

    yes otto, some say this, but its the only way i can have more control over my content pages, than the ‘basic’ editing the WP dashboard allows u. im nearly there, you can keep an eye on the progress as the link is above ??

    how else would you suggest i got the desired page layout, including the grey ‘non widgetised’ column?

    PS: is it this exact CSS coding between the <style/> tags that needs to go into my themes styles.css?

    please dont give up on me(!)
    HH

    Thread Starter Johnny Bravo

    (@herbiehysteria)

    PLEASE HELP! Or someone recommend an alternative solution to using Dreamweaver??? the standard WP editor is terrible.

    Surely, I am not the first person with this problem??? I am losing all productivity and patience here. The problem is still ‘live’ at https://www.artbyherbie.com/wptest.

    thanks!
    ??

    Personally I use a text editor that includes customisable syntax highlighting and an ability to main custom clip libraries.

    https://www.textpad.com

    Thread Starter Johnny Bravo

    (@herbiehysteria)

    hi guys,
    just to say the problem is sorted, i changed the way my page layouts were created. Instead of absolutely positioned, i left the positioning blank and it works great. Everything is within the content area. You can see it here:

    https://www.artbyherbie.com/wptest

    Thanks everyone for your help.
    Herbie ??

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘HTML pages in Dreamweaver not showing in the content area’ is closed to new replies.