HTML Logo by World Wide Web Consortium (www.w3.org). Click to learn more about our commitment to accessibility and standards.

Moving forward with Composr

ocPortal has been relaunched as Composr CMS, which is now in beta. ocPortal 9 will be superseded by Composr 10.

Head over to compo.sr for our new site, and to our migration roadmap. Existing ocPortal member accounts have been mirrored.


arrg

Login / Search

 [ Join | More ]
 Add topic 
Posted
Rating:
#25370 (In Topic #5960)
Avatar

Community saint

Trouble getting an image to work in css.

.top2 {
background-image: url("{$IMG,top}");
background-repeat: repeat-x;
}

I added that into the css.
And this where I wanted that to show up.
<div class="top">
</div>

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25373
Avatar

Community saint

Are you calling the right class in your div, or is that a typo?

Take my advice. I'm not using it!

View my working ocPortal site (version 9.x.x) at Anglo-Indian Portal
Back to the top
 
Posted
Rating:
#25376
Avatar

Community saint

yes thats a typo.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25378
Avatar

If in doubt, the Firefox Developers Toolbar is extremely useful. You can test CSS changes and see how the HTML currently loaded up responds. Then once you've made your decisions, you can go back to ocPortal and write the changes in properly.


Become a fan of ocPortal on Facebook or add me as a friend. Add me on on Twitter.
Was I helpful?
  • If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
  • If so, please let others know about ocPortal whenever you see the opportunity.
  • If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying ocPortal on fun personal projects.
  • If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Back to the top
 
Posted
Rating:
#25379
Avatar

Community saint

Well while I wait for that slow thing to run I will post the full code.

Code

<div class="top2">
<div class="global_top">
   {$SET,PREVIOUS_ZONE,_false}
   <div class="global_zones">
   {+START,LOOP,ZONES}
      {+START,IF,{$AND,{$NEQ,{CODE},},{$NEQ,{CODE},docs}}}
         {+START,IF,{$GET,PREVIOUS_ZONE}}|{+END}
         <a {+START,IF,{$IS_STAFF}}title="{!SPECIAL_CLICK_TO_EDIT#}" onclick="Javascript: if (!window.handleZoneClick) return true; if (!event) event=window.event; return handleZoneClick(this,event,'{CODE*;}');" {+END}{+START,IF,{$NOT,{$GET,PREVIOUS_ZONE}}}accesskey="Z" {+END}href="{$PAGE_LINK*,{CODE}}" class="{$?,{$EQ,{$ZONE},{CODE}},current_zone,non_current_zone}">{TITLE}</a>
         {$SET,PREVIOUS_ZONE,_true}
      {+END}
   {+END}
   </div>
   <div class="global_logo">
      {LOGOMAP}
      <img usemap="#logomap" src="{LOGOURL*}" title="{HEADER_TEXT*}" alt="{HEADER_TEXT*}" />
   </div>
   {$SET,BANNER,{$BANNER}} {$,This is to avoid evaluating the banner parameter twice}
   {+START,IF_NON_EMPTY,{$GET,BANNER}}
      <div class="global_banner" style="text-align: {!en_right}">{$GET,BANNER}</div>
   {+END}
</div>

</div>

Code

body, .re_body {
   color: #cccccc; /* {$,wizard, 20% seed + 80% !W/B} */
}

.top2 {
background-image: url("{$IMG,top2}");
background-repeat: repeat-x;
}

.global_top {
   background-color: #000000; /* {$,topcolor, 100% bgcol } */
   background-image: url('{$IMG,zone_gradiant}');
   background-position: bottom left;
   background-repeat: repeat-x;
   height: 118px;
   padding-right: 3px
}

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25380
Avatar

Community saint

Firefox is telling me this.
# .top2 {

    * background-image : url("");
    * background-repeat : repeat-x;

}

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25382
Avatar

Are you sure the top2 image exists and is recognised as a theme image by ocPortal?

Back to the top
 
Posted
Rating:
#25383
Avatar

Community saint

Yes and that fixed the fire fox thing but its still not showing up.
Or do you mean i have to use the manage image dealy?

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25384
Avatar

Community saint

I just checked that and it does have it listed and does show in the little preview box above.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25396
Avatar

You could try holding Ctrl+Alt+Shift and refreshing on the page which is supposed to have this image.

Also (just to check every base), are you sure top2 is listed as an image in the theme you're editing, and isn't accidentally in the default (or another) theme?

Back to the top
 
Posted
Rating:
#25405
Avatar

Community saint

I do that all the time now after making changes.
It is in the correct theme when I went into the image editor of that theme it was there.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25416
Avatar

I think the global_top class has a background color and hence would obscure your background.


Become a fan of ocPortal on Facebook or add me as a friend. Add me on on Twitter.
Was I helpful?
  • If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
  • If so, please let others know about ocPortal whenever you see the opportunity.
  • If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying ocPortal on fun personal projects.
  • If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Back to the top
 
Posted
Rating:
#25432
Avatar

Community saint

Ah I was thinking about merging the global_top class with the new class I made.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25434
Avatar

Well-settled

Is this for my site? If so, could you make the background Black (#000000), not dark grey (#cccccc) please?

Coming Soon: Syntyx Community (http://syntyx.net)

Syntyx Community will be a software community. Current projects include PCAno (Virtual Piano) and XCryptoTool (Extremely Secure File Encryption Software).

Website will be powered by ocPortal, of course ;)
Back to the top
 
Posted
Rating:
#25439
Avatar

Community saint

Yes thats not a problem

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25444
Avatar

Community saint

 I got it working, Found out I had to add top: 89px; To the css and it worked.
You should have the link to look at it in your PT.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25446
Avatar

Well-settled

 That's perfect! :) Even the banner works!
Now, is it possible to have the Site|Forums etc. bar in between two lines, like the logo? And aligned to the left?
I hope this doesn't sound like to much work…
The reason I want the link left aligned is a lot of PC's at my school use 800x600 resolution.
I still want it optimised for 1024x768, I just think it'll look nicer


Last edit: by scurless

Coming Soon: Syntyx Community (http://syntyx.net)

Syntyx Community will be a software community. Current projects include PCAno (Virtual Piano) and XCryptoTool (Extremely Secure File Encryption Software).

Website will be powered by ocPortal, of course ;)
Back to the top
 
Posted
Rating:
#25447
Avatar

Community saint

Thats not a problem.
I could add red gradient to the Bar going across and ledt align is not to hard.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
Posted
Rating:
#25448
Avatar

Well-settled

I want it to look like this:

Red Line——
Logo        Banner  < Black BG
Red Line——
Site|Forums etc.    <Black BG
Red Line——

Coming Soon: Syntyx Community (http://syntyx.net)

Syntyx Community will be a software community. Current projects include PCAno (Virtual Piano) and XCryptoTool (Extremely Secure File Encryption Software).

Website will be powered by ocPortal, of course ;)
Back to the top
 
Posted
Rating:
#25450
Avatar

Community saint

Yes I can do that, I will just had to make the gape smaller and its what I had in mind.

I run http://otakuplayground.com and am hopping to make themes and other things for ocportal even though I no longer use it for otakuplayground.com I still love it and feel it could go far with the right help. It needs themes and needs people to advertise for it.
Back to the top
 
There are too many online users to list.
Control functions:

Quick reply   Expand