Shape - how do I stretch it across the whole page?

Collapse
This topic is closed.
X
X
 
  • Filter
  • Time
  • Show
Clear All
new posts
  • lopeman
    Private First Class

    • Jun 2008
    • 5

    Shape - how do I stretch it across the whole page?

    I have added a dark brown square shape, stretched it to be a rectangle and used it as part of my background behind the writing, titles and buttons on the top of each of my pages. I would like it to appear stretched across the whole page, disappearing off the edges on each side (like the backgorund colour is over the whole page) rather than limit the size as it is now. Can you give me any tips on how to do this? I am not a tech-head so please keep the instructions simple or I won't be able to follow them. My site is www.armourglaze.com.au
  • Vasili
    Moderator

    • Mar 2006
    • 14683

    #2
    Re: Shape - how do I stretch it across the whole page?

    Originally posted by lopeman View Post
    I have added a dark brown square shape, stretched it to be a rectangle and used it as part of my background behind the writing, titles and buttons on the top of each of my pages. I would like it to appear stretched across the whole page, disappearing off the edges on each side (like the backgorund colour is over the whole page) rather than limit the size as it is now. Can you give me any tips on how to do this? I am not a tech-head so please keep the instructions simple or I won't be able to follow them. My site is http://www.armourglaze.com.au
    I know what you are trying to do, but I can't find the thread to refer you to that would make it easier for you to follow (or me to refer without typing up a whole new reply!).

    You will basically have to create an image 1/3 size (since that is the extent that you can manipulate and "see" an image in the BV workpane) that when completed, you will make larger to use properly. For most monitor resolutions, any background needs to be at least 1750-1800 pixels wide so it will not "tile" across the screen. And, given most web pages are at least 800-1500 pixels tall, this also must fit into the dimensional image we are going to make.

    1. We will make a single image 600 pixels wide and 500 pixels tall, and when resized 3 times (3x), it will give us a usable background image 1800 x 1500.
    2. In your current BV page that has the temporary "stripe" running across the background, click on it once to reveal the actual size of this shape (you can see the width and height in the X-Y Axis Plotter in the far bottom-right of your BV workpane).
    3. If it is say, 65 pixels tall, we can round up to instead make it an easy 66 to then create a 1/3 size in our image building as 21 pixels tall.
    4. Note the position of the temporary shape still being clicked ... again the X-Y Axis will show the exact position of how far down the page it is. Again, we will use a 1/3 value of this position to apply to our building process. For example, if it was 175 pixels down from the top, we'll round up again to 180 and use 60 pixels from the top of our basic background for precise positioning. (It may be 1-3 pixls off, but when enlarged this degree of accuracy is not really that important)
    5. In a new BV page, create a shape 600 pixels wide and 500 pixels tall, color it the way you want it to be, and place it completely furthest top-left against the page rules so you can measure placement accurately later. Make sure you have selected "Anti-Alias" in Shape Properties, and have reduced/eliminated any border.
    6. Create the "stripe" that is to run across the entire background, placing it at the 1/3 page position from the top of the background shape. Color it as desired, also setting Anti-Alias and with no border. Make sure you then set the height at the 1/3 height as required.
    7. Now ... using your Keyboard, hit SHIFT+A to "select all" the items on your page. Now you will move them DOWN and RIGHT ... away from the BV Page Margins and Rules: you will need to have some white border around your image to properly crop!
    8. Take a SCREENSHOT/PrintScreen of this image of the BV Workpage.
    9. If you have a Photo-editor that allows it (if you don't you will use MS Publisher) open whichever and PASTE AS NEW IMAGE this screenshot. (In Publisher, it is PASTE onto a new Blank Page).
    9a. If using Publisher, you will for this "Document" then SAVE as JPG using the SAVE AS FILE TYPE Drop-Down Menu, and then re-open this new image in your Editor to Crop, and whatever else Step 10 mentions.
    10. In the Photo Editor, you can now re-size the image to 1800 pixels wide (and the ratio will automatically take care of the height). SHAR PEN the image (and, if available, DE-SPECKLE), and SAVE as a JPG file with a new name (one that needs be "relevant" to your site for optimization purposes, such as "CompanySiteNameInc").
    11. You can now select this new background image in BlueVoda to import directly from your local system to load to your webpage in each page's PAGE PROPERTIES.
    12. Be sure to also select "Center this page horizonatally in browser" while in PAGE PROPERTIES so your web pages properly display across this new "universally viewable" background.

    > A Very Cool PhotoEditor Package, 80% off - only $14.99 (One of the titles I use)
    > Free Photo Editor
    > Top Free Photo Editor Picks For Windows
    > Free Online Photo Editor
    > Free Photo Editor Bundle (Gimp)

    I personally use JASC Pro Paint & Photo Editor, and there are a couple versions Free to downlaod if you Google it. The key is to find one that you can "paste" or "Copy as New Image" your screenshots into and crop, etc. normally.

    > How To Set Up Page Properties in BlueVoda
    (backgrounds, fonts, META, etc.)
    * Note: Tutorial is dated - Backgrounds are defined in the updated "Formatting" Tab in PAGE PROPERTIES, not the "Background" Tab shown in the Tutorial.

    > Complete BlueVoda Tutorial Library...
    Complete A-Z video tutorials covering all aspects of building and publishing a website with the BlueVoda website builder.

    > Complete Tutorial Archive (BlueVoda, Control Panel, Email, DNS, more)
    > VodaHost Web Building Knowledgebase
    > Useful Resources & Help Center
    . VodaWebs....Luxury Group
    * Success Is Potential Realized *

    Comment

    • lopeman
      Private First Class

      • Jun 2008
      • 5

      #3
      Re: Shape - how do I stretch it across the whole page?

      Thanks Vasili. I'm going to give this a go! Appreciate all the trouble you took to write these instructions. :)

      Comment

      Working...
      X