11
Will_H
Re: Slicing images
  • 2006/9/22 15:06

  • Will_H

  • Friend of XOOPS

  • Posts: 1786

  • Since: 2004/10/10


I will give you an example from the theme I am currently working on.

Quote:

<TABLE WIDTH=100% BORDER=0 CELLPADDING=0 CELLSPACING=0>


27CDB6E-AE6D-11cf-96B8-444553540000" id="obj1" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" WIDTH="406" HEIGHT="240" id="logo" ALIGN="">





27CDB6E-AE6D-11cf-96B8-444553540000" id="obj1" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" WIDTH="415" HEIGHT="240" id="logo" ALIGN="">





















blue is header.

12
ccczone
Re: Slicing images
  • 2006/9/22 16:47

  • ccczone

  • Just popping in

  • Posts: 13

  • Since: 2006/3/20


Okay, here is what i have. The theme.html file with logo added, using an image map.

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<{$xoops_langcode}>" lang="<{$xoops_langcode}>">
<
head>
<
meta http-equiv="content-type" content="text/html; charset=<{$xoops_charset}>" />
<
meta http-equiv="content-language" content="<{$xoops_langcode}>" />
<
meta name="robots" content="<{$xoops_meta_robots}>" />
<
meta name="keywords" content="<{$xoops_meta_keywords}>" />
<
meta name="description" content="<{$xoops_meta_description}>" />
<
meta name="rating" content="<{$xoops_meta_rating}>" />
<
meta name="author" content="<{$xoops_meta_author}>" />
<
meta name="copyright" content="<{$xoops_meta_copyright}>" />
<
meta name="generator" content="XOOPS" />
<
title><{$xoops_sitename}> - <{$xoops_pagetitle}>title>
<
link href="<{$xoops_url}>/favicon.ico" rel="SHORTCUT ICON" />
<
link rel="stylesheet" type="text/css" media="screen" href="<{$xoops_url}>/xoops.css" />
<
link rel="stylesheet" type="text/css" media="screen" href="<{$xoops_themecss}>" />

<{
$xoops_module_header}>
<
script type="text/javascript">

script>
head>

<
body>

<
table width="885" border="0" cellspacing="0" cellpadding="0">
  <
tr id="header">
    <
td id="headerlogo"><img src="<{$xoops_imageurl}>images/logo.gif" width="885" height="148" border="0" usemap="#Map" />td>
  tr>
table>
<
table cellspacing="0">
    <
tr>
      <
td id="leftcolumn">
        
        <{foreach 
item=block from=$xoops_lblocks}>
          <{include 
file="default/theme_blockleft.html"}>
        <{/foreach}>
        

      td>

      <
td id="centercolumn">

        
        <{if 
$xoops_showcblock == 1}>

        <
table cellspacing="0">
          <
tr>
            <
td id="centerCcolumn" colspan="2">

            
            <{foreach 
item=block from=$xoops_ccblocks}>
              <{include 
file="default/theme_blockcenter_c.html"}>
            <{/foreach}>
            

            td>
          tr>
          <
tr>
            <
td id="centerLcolumn">

            
              <{foreach 
item=block from=$xoops_clblocks}>
                <{include 
file="default/theme_blockcenter_l.html"}>
              <{/foreach}>
            

            td><td id="centerRcolumn">

            
              <{foreach 
item=block from=$xoops_crblocks}>
                <{include 
file="default/theme_blockcenter_r.html"}>
              <{/foreach}>
            

            td>
          tr>
        table>

        <{/if}>
        

        <
div id="content">
          <{
$xoops_contents}>
        div>
      td>

      <{if 
$xoops_showrblock == 1}>

      <
td id="rightcolumn">
        
        <{foreach 
item=block from=$xoops_rblocks}>
          <{include 
file="default/theme_blockright.html"}>
        <{/foreach}>
        
      td>

      <{/if}>

    tr>
  table>
<
map name="Map" id="Map">
  <
area shape="rect" coords="243,110,286,126" href="#" />
  <
area shape="rect" coords="292,109,338,126" href="#" />
  <
area shape="rect" coords="346,108,444,126" href="#" />
  <
area shape="rect" coords="451,105,516,125" href="#" />
  <
area shape="rect" coords="516,108,586,123" href="#" />
  <
area shape="rect" coords="590,108,644,125" href="#" />
  <
area shape="rect" coords="514,132,632,146" href="#" />
map>
body>
html>


Now here is my next question. And this has to do with image placement.

First off, here is a link to the images i currently have sliced...
http://s98.photobucket.com/albums/l251/ccczone/
You will see a few images the same and a few i cut thinking i may need them.

Now, on the left side, i need to stretch the stars image as the border, so when the page grows, this grows.

Also, either the left.gif or menu_chpt.gif is to be the actual left column. The Find your CHapter is going to be image mapped and the main menu is going to rest inside the red block.

Where do i put these files? In the theme.html or the theme_blockleft.html? BEcause adding them to the css file, they're not showing up.

If you look at the site: http://payd.checkmywebpage.com/ i have the logo image displayed with working image map. I think where i'm getting confused is what file to put the rest of the images.

Now, when opening the theme_leftblock and theme_rightblock files, allt hat is there is:
<div class="blockTitle"><{$block.title}>div>
<
div class="blockContent"><{$block.content}>div>


So the other question i have is, if i need to put the image files here, my html ie: table tags go after the div tags correct?


(this was originally going to be a static site, thus the way it was designed. But minds changed and they want a database driven site)

13
Will_H
Re: Slicing images
  • 2006/9/22 20:01

  • Will_H

  • Friend of XOOPS

  • Posts: 1786

  • Since: 2004/10/10


Ok when you slice an image you have to think of your website like its a brand new picture frame.

When you buy a picture frame there is always a picture of some really hot lady that you really wanna put up on the shelf and claim as your girlfriend.

If only it didnt say $2.99 on it!

So we are forced to remove the picture.

If you remove the picture all you are left with is the borders. Just put the vorders together.

Frame around your future XOOPS contents.

Your slices are too big, there is content already in them as well. Remove it. take your right blocks for example. if you used it like that, that little add would sit at the top of every single right block.

14
ccczone
Re: Slicing images
  • 2006/9/22 20:16

  • ccczone

  • Just popping in

  • Posts: 13

  • Since: 2006/3/20


confusious say:i'm confused enough. beside that girl int he photos is always butt ass ugly!!!

Ok, i used the css file to try and call the background images. nothing showed up. The only way i can get any images to show up is if i make the the backgroundimage in the theme.html file. Then nothing else shows up. No block, no nothing.

i just asked the boss about it. This entire project is being donated. so that tosses out bassmans offer, unless i pay out of pocket. Plus, he said they will have to be able to log in and change text themselves. So a static site is out.

from everything i have read, i am doing this in step. but i'm missing something somewhere.

my images are too big?

15
Will_H
Re: Slicing images
  • 2006/9/22 20:45

  • Will_H

  • Friend of XOOPS

  • Posts: 1786

  • Since: 2004/10/10


lol! I'll see what i can put together with what you have provided.

I can atleast get the frame together for ya

you have a psd?

16
ccczone
Re: Slicing images
  • 2006/9/22 22:30

  • ccczone

  • Just popping in

  • Posts: 13

  • Since: 2006/3/20


check your pm

17
Will_H
Re: Slicing images
  • 2006/9/23 12:38

  • Will_H

  • Friend of XOOPS

  • Posts: 1786

  • Since: 2004/10/10


ugh.... friday nights.... saturday mornings...


cool man,check your pm.

Login

Who's Online

321 user(s) are online (62 user(s) are browsing Support Forums)


Members: 0


Guests: 321


more...

Donat-O-Meter



<{foreach item=block from=$xoops_lblocks}>
<{include file="cod/side_blocks.html"}>
<{/foreach}>

Stats
Goal: $100.00
Due Date: Jul 31
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $100.00
Make donations with PayPal!

Latest GitHub Commits