Template Text Inserts

[GraphicDesNew2Webdesign]

Hello all,

 

I am new to webdesign and am using DW CS3. I purchased a template I liked from 4templates.com and am trying to insert text and images in specific places within the framework that the template designer apparently did not set it up for. He designed very few/limited text and image fields, and I need to add text and image boxes in other places. For example, I tried to insert and image while my cursor is placed where I want it, and the logo will only appear WAAAAAAAYYYYY at the top or WAAAAYYYYY at the botttom depending on my cursor position. How do I bypass the pre-established template framework and insert text and images where I please. More specifically, do I want to insert a text box, or an image bounding box with my cursor in place (sometimes it wont let me place my cursor where I want to though), or do I want to only "insert text" or "insert image" without the box. And then how do I have control over how much space is above or below or besides the new text so it isnt crammed in? (I tried modifying the padding under "Box" in the "edit style" button and sometimes that only pushes the images down below it but not the other text below it (this maybe due to some CSS rules associated with the text I am editing that was coded by the template designer so how do I TURN OFF or REMOVE the CSS tagged to the text I am trying to gain more control over and take away all the constraints that the designer placed on that text that limits my editing abilities? THANKS TO ALL!!

[falkencreative]

How much you can edit the template depends on how the template is coded. You may not be able to "insert text and images where you please." It really has to be coded in such a way that allows you to place text or images where you want them to. Dreamweaver is simply a tool -- you often do have to know some coding in order to make things work for you. If the current template isn't working for you, you have a couple options:

 

-- learn some HTML and CSS so you can do the coding yourself. Having a better understanding of how Dreamweaver works may also be helpful.

-- Hiring someone who understands HTML/CSS to modify the template for you

 

If you are wanting to learn things for yourself, you may want to check out http://how-to-build-websites.com/ and http://www.csstutorial.net/. KillerSites also offers paid video tutorial courses to help you learn web coding topics: http://killervideostore.com/. Although learning HTML and CSS isn't terribly complicated, it still will take time and effort.

 

Alternately, if you don't have the time to learn this yourself, it shouldn't be hard to find someone to help you. I'd be happy to give you a quote for the work involved, and I'm sure there are a couple others here who may be able to help you out as well.

 

We are also willing to help here on the forum, but you'd need to post the HTML/CSS so we can take a look, and specify what changes you are looking for. Although we are happy to help, we usually don't do all the work for you.

[GraphicDesNew2Webdesign]

Thanks Ben! So it sounds like there is no way to insert a new text box within the given framework without first editing the template structure overall? So there is no loophole / simple solution like adding a text box where there lacks a textbox or just lessening the bottom padding ont he elements above where I want my new text so it allows me to add text box / elements under neath it without pushing the new text way down?

 

Anybody have any round about loophole ways of doing so?

 

I HAVE ATTACHED MY HTML , CSS & A SCREENSHOT

 

Examples of what I need to do:

-I need to place the logo right dead center (horizontally and vertically centered) in the middle of the black rectangle (currently below the logo b/c when I insert image it will only insert above the black rectangle or way below it).

 

-I also need to add a text box or just plain text below the logo once placed but I do not want to affect to much of the rest of the layout b/c everything else is perfect so I dont want to make all the other elements shift around or jumble.

 

THANKS GUYS!

home-licensed-electrician-rockville-md.html

default.css

[Andrea]

For starters, this

IA Logo4(HIGHER UP ON BLUE RAYS)-CF-ENLARGED NEXT 2 BULB-SMALL4WEB copy.jpg

is a bit long for any file or image name - and, there should NEVER be a space. I've renamed it to 'logo.jpg'.

 

If you go into code view and find the code that belongs to this image (at the very end of this part):

 <div id="wrapper">
<div id="header-wrapper">
	<div id="header" class="container">
  	<div id="menu">
			<ul>
				<li><a href="#">Home</a></li>
				<li><a href="#">ABOUT</a></li>
				<li><a href="#">GALLERY</a></li>
				<li><a href="#">TESTIMONIALS</a></li>
				<li><a href="#">Contact</a></li>
			</ul>
  	</div>
 		<a href="#"><img src="images/IA Logo4(HIGHER UP ON BLUE RAYS)-CF-ENLARGED NEXT 2 BULB-SMALL4WEB copy.jpg" alt="logo placeholder md electrician" name="electricianMD" width="162" height="168" id="electricianMD" /></a>

 

The code for the image is this part:

<a href="#"><img src="images/IA Logo4(HIGHER UP ON BLUE  RAYS)-CF-ENLARGED NEXT 2 BULB-SMALL4WEB copy.jpg" alt="logo placeholder  md electrician" name="electricianMD" width="162" height="168"  id="electricianMD" />

 

Change that to this (notice that I renamed the image file):

<div id="textbox">
<a href="#"><img src="images/logo.jpg" alt="logo placeholder md electrician" name="electricianMD" width="162" height="168" /></a>
<p>A simple text box under the image</p>	
</div>

and insert that right this part:

<div id="wrapper">
<div id="header-wrapper">

 

Now, insert into your default.css:

 

#textbox {
width: 162px;
float: left;
margin-top: 180px; 
margin-left: 230px;
background: silver;
}

(doesn't matter where, just don't put it inside some other bracket on there.)

 

Then you get THIS

 

You probably have to adjust the margins, since I don't have any of your images, I cannot really see the entire thing. I also added the silver background color, just so we can see where things are.

 

But you really should change all your image and file names. They should be descriptive where possible, but don't need to be this long. And,, if this page we're seeing her is the home page, it should just be called index.html.