3 Replies Latest reply on Apr 13, 2010 10:01 AM by osgood_

    Template Problem

    thejs27 Level 1

      i have a template i created and am using for each of my pages.... Of course I made different portions editable, and some not.... anyway my question is.... how do i change the font colors, font sizes, and texts of my pages? everytime i try it says... Making this change would require changing code that is locked by a template or translator. change will be discarded

        • 1. Re: Template Problem
          osgood_ Level 8

          thejs27 wrote:

           

          i have a template i created and am using for each of my pages.... Of course I made different portions editable, and some not.... anyway my question is.... how do i change the font colors, font sizes, and texts of my pages? everytime i try it says... Making this change would require changing code that is locked by a template or translator. change will be discarded

           

          Not sure what your template code looks like but in normal circumstances Dreamweaver won't write any specific code that relates to fonts/sizes/colours etc. Your font colours/sizing, positioning is all now controlled by css.

           

          Therefore to change a font color/size from one page to another you only need to 'overwrite' the current css style.

           

          For instance code can look like this:

           

          <div id="container">

          <p>This is a paragraph</p>

          <p>This is another paragraph</p>

          </div>

           

          See no reference to fonts/colours/sizing or any thing just raw html code.

           

          Your css, usually in a linked css stylesheet, may look like: (example shows attributes for a paragraph tag (p))

           

          p {

          color: #000;

          font-size: 11px;

          }

           

          If you want to change those properties for a particular page/s you have to overwite the linked css stylesheet by inserting the new style in the <head> section of the page. If you look in your pages code you should already have an 'editable' region in the <head> section, near to the top.

           

          All you need to do is write the new values into the editable region. Example below:

           

          <style type="text/css">

          p {

          color: #fff;

          font-size: 16px;

          }

          </style>

           

          The new style MUST come after the link to the pages main css stylesheet.

          • 2. Re: Template Problem
            rebeccajane1299 Level 1

            osgood_ wrote:

             

            thejs27 wrote:

             

            i have a template i created and am using for each of my pages.... Of course I made different portions editable, and some not.... anyway my question is.... how do i change the font colors, font sizes, and texts of my pages? everytime i try it says... Making this change would require changing code that is locked by a template or translator. change will be discarded

             

            Not sure what your template code looks like but in normal circumstances Dreamweaver won't write any specific code that relates to fonts/sizes/colours etc. Your font colours/sizing, positioning is all now controlled by css.

             

            Therefore to change a font color/size from one page to another you only need to 'overwrite' the current css style.

             

            For instance code can look like this:

             

            <div id="container">

            <p>This is a paragraph</p>

            <p>This is another paragraph</p>

            </div>

             

            See no reference to fonts/colours/sizing or any thing just raw html code.

             

            Your css, usually in a linked css stylesheet, may look like: (example shows attributes for a paragraph tag (p))

             

            p {

            color: #000;

            font-size: 11px;

            }

             

            If you want to change those properties for a particular page/s you have to overwite the linked css stylesheet by inserting the new style in the <head> section of the page. If you look in your pages code you should already have an 'editable' region in the <head> section, near to the top.

             

            All you need to do is write the new values into the editable region. Example below:

             

            <style type="text/css">

            p {

            color: #fff;

            font-size: 16px;

            }

            </style>

             

            The new style MUST come after the link to the pages main css stylesheet.

            I have the same problem in Dreamweaver CS4 (http://http://forums.adobe.com/thread/616335?tstart=0). However my template was made using the 3 column fixed, header and footer layout supplied by Dreamweaver, therefore all the CSS is saved in a style folder, which is accessible through each page. I have tried to copy your example html code:

             

            <style type="text/css">

            p {

            color: #fff;

            font-size: 16px;

            }

            </style>

             

            into my editable region to test but it doesn't seem to be overwriting the CSS from the original template. i.e: the bodytext css in the original file is set to black arial size 12. And this doesn't change, even when I input the html above.

             

            Ultimately, I would like the middle column of the webpage to contain purple text, size 12 with a margin around the outside so that there is space between the text in the main section and the text in the two side columns.

            • 3. Re: Template Problem
              osgood_ Level 8

              rebeccajane1299 wrote:

               

              I have the same problem in Dreamweaver CS4 (http://http://forums.adobe.com/thread/616335?tstart=0). However my template was made using the 3 column fixed, header and footer layout supplied by Dreamweaver, therefore all the CSS is saved in a style folder, which is accessible through each page. I have tried to copy your example html code:

               

               

              <style type="text/css">

              p {

              color: #fff;

              font-size: 16px;

              }

              </style>

               

              into my editable region to test but it doesn't seem to be overwriting the CSS from the original template. i.e: the bodytext css in the original file is set to black arial size 12. And this doesn't change, even when I input the html above.

               

              Ultimately, I would like the middle column of the webpage to contain purple text, size 12 with a margin around the outside so that there is space between the text in the main section and the text in the two side columns.

               

              Not sure what the 'id' of the middle column is but you need to target the text within that <div>.

               

              Example:

               

              #whatever {

              color: #639;

              font-size: 12px;

              }

               

              It's best if the text in the middle column is in paragraphs and that you target them like as follows:

               

              #whatever p {

              color: #639;

              font-size: 12px;

              padding: 0 15px 0 15px /* top,right,bottom,left */

              }

               

              You need to make sure you include the above in the editable css region of the page and IT MUST come after any link to the main css stylesheet.

               

              If in doubt post the code of the page here and say what you want to be purple and I'll  have a look at it.