Need a new web host or having a problem with a script? Tips and advice on the best way to design, build and maintain your most valuable asset - your website!

Instant Corners problem - Step-by-step guide please?

don
Posts: 10
Joined: 19 Apr 07
Trust:

Instant Corners problem - Step-by-step guide please?

Help, i downloaded instant corners and unzipped, tried to use it ??
it completely messed up my page, all i got was a box on my web page but i lost all the information that i had put there, had to start all over again as i obviously did something wrong and the instant corner box had saved.
anyone give me a step by step guide as to what to do please.
i havn't seen any instructions with the download

i also see on some websites that the borders seem to have a shadow effect, how do you do that ???

thanks Paul
  • 0
PremiumMember
chatyak86
Posts: 1369
Joined: 17 Jun 06
Trust:
The shawdow box is done with photoshop.... I am going to guess that is too advanced for you at this point. I will let someone answer for the instant corner program as I make my own.
  • 0
Site Admin
markling
Posts: 2488
Joined: 13 Jun 06
Trust:
The instant corners software produces an HTML page and a bunch of images that make the rounded corners. The HTML page contains a table which aligns all the images into the rounded box, and gives you a space to write your content.

In order to get the round-cornered box onto your site you need to open up the HTML page produced by Instant Corners, then copy and paste the box into your existing web page. It's probably best to do this in code view if you're using a WYSIWYG editor... it's all the stuff within the <table> tags.

I don't see how it could have wiped your existing page, unless you saved the file over top of your existing HTML file. Instant Corners by default saves the page it produces as "Table.html" ... did you rename this file? Was your old page called "table.html"? I'm not sure what could have happened.

Here's some stuff from a previous post on the subject:

------------------------

To get the round-cornered box into your site, you need to view the page source of the round-corners HTML page, copy the part that creates the round box (the <table> tags and everything inside) and then paste that into Dreamweaver using the code view (as opposed to the preview view)

Actually, I've just taken a look at the HTML the software produces, and it seems to be producing boxes with gaps in them when I view the pages in Firefox. (IE looks fine... go figure.)

I've tweaked the code so it renders fine in Firefox. Try pasting this into your table code instead:


Code: Select all
<!-- START ROUND-CORNERED BOX -->
<table border="0" cellpadding="0" style="border-collapse: collapse" bordercolor="bg_color%" cellspacing="0" width="60%" height="40%"> <!-- CHANGE WIDTH/HEIGHT PERCENTAGES TO MAKE BOX BIGGER OR SMALLER -->
  <tr>
    <td height="25" width="25">
    <img border="0" src="corner1.jpg" width="25" height="25"></td>
      <td>
    <img border="0" src="side1.jpg" width="100%" height="25"></td>
    <td>
    <img border="0" src="corner2.jpg" width="25" height="25"></td>
  </tr>
  <tr>
    <td>
    <img border="0" src="side3.jpg" width="25" height="100%"></td>
    <td bgcolor="#0000FF" valign="top"> <!-- ENTER YOUR OWN COLOR HERE -->
    <p align="center"><font face="Arial"><b>Congratulations on your new rounded corners =)<br>
    </b>There are 8 images for this table:<br>
    corner1-4 are the corners <br>
    side1-4 are the sides</font></td>
   <td>
    <img border="0" src="side2.jpg" width="25" height="100%"></td>
  </tr>
  <tr>
    <td height="25">
    <img border="0" src="corner3.jpg" width="25" height="25"></td>
    <td>
    <img border="0" src="side4.jpg" width="100%" height="25"></td>
    <td>
    <img border="0" src="corner4.jpg" width="25" height="25"></td>
  </tr>
</table>
<!-- END ROUND-CORNERED BOX -->



The stuff inside the <!-- --> things are comments, and they tell you what to do. As with the HTML produced by the round-corners software, this code assumes that the images are kept in the same folder as the HTML itself. If you've put your images inside a special images folder, you'll need to change the file path inside the <img> tags. (ie. <img src="../images/corner3.jpg" width="25" height="25"> )

If you're using the "large" round corners option, every time it says "25" up there, change it to "41".

All that looks pretty intimidating, but give it a go and let us know how you get on.
---------------

Hope that helps,
Mark
  • 0
Limited time special - Try Affilorama Premium for just $1 for 7 days: http://www.affilorama.com/premium
 
don
Posts: 10
Joined: 19 Apr 07
Trust:
many thanks will try out later, i was probably dumb and saved over

Paul
  • 0