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.


Banner/Header Image

Login / Search

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

Fan in training

Where can i find the html template to change the sizing of this area so that i can fit in my own image. Im am getting pretty frustrated with this template system. its very confusing. I keep looking in these empty folders and all the html files are empty and everything i want to do cant be done in the template editor. its so annoying. Where are the HTML templates and tables stored. i want to change the main pages layout as well as the post bit and main forum category view template
Back to the top
 
Posted
Rating:
#31286
Avatar

I keep looking in these empty folders and all the html files are empty and everything

Please read the themeing tutorials, which will explain how the system works. The template files are .tpl files, and are best edited from within ocPortal, using the template editor. Editing the files manually requires manually clearing or disabling the template cache when a change needs making.

and everything i want to do cant be done in the template editor

There isn't any part of the theme system that can't be done from within ocPortal. All the templates, CSS and images may be edited/substituted.

Where are the HTML templates and tables stored.

The templates are in the themes/default/templates, themes/default/templates_custom, themes/<themename>/templates, and themes/<themename>/templates_custom directories. There is an override system, and a theme system, so the actual location of the file depends on whether the original has been overridden (templates_custom) and whether it has been customised for a specific theme (underneath the themes directory).

With regard HTML tables:
Tableless web design - Wikipedia, the free encyclopedia

Where can i find the html template to change the sizing of this area so that i can fit in my own image

The TOP template defines the HTML for the area. The following CSS from global.css styles the area:

Code

.global_top {
   background-color: #E3EAF2; /* {$,topcolor, 100% bgcol } */
   background-image: url('{$IMG,zone_gradiant}');
   background-position: bottom left;
   background-repeat: repeat-x;
   height: 89px;
   padding-right: 3px
}
CSS is editable from within the Theme Management area, and is best done from there rather than by manual file editing for the same reason with templates.

So if you wanted to preserve the gradient line that goes around from the logo and across the top, but make it all taller, you'd change the height in here. If you wanted to tear it out you'd probably remove background-image and height and do some rewriting of the TOP template.
To change the image for the logo, hold down ctrl+alt+shift and click on it. This is a shortcut to open it up in the theme image editor. You can replace it with an image of any size, but it won't look right unless you adjust the CSS like I just mentioned.


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:
#31363
Avatar

The template files are .tpl files, and are best edited from within ocPortal, using the template editor

You can think of these .tpl files as .html files - because they mostly have HTML. The reason they have a different extension is because we added something called "tempcode" to them and by changing the filename it helped us distinguish between them.

And if you haven't read this already, give it a shot: ocPortal Tutorial: Themeing your site

I know I wrote a step-by-step example for making template edits once. If it's not in the documentation section of our site it may be posted here - let me try to find it.

*edit*
Here you go - this is an example where I helped walk someone through a specific example. I did it that one time to try and jump start the theme-making community, designing it like a tutorial: ocPortal - View topic: Theme Help

I won't have the ability to walk others through the process in such depth, but hopefully you'll be able to learn something by reading through that example. It really is a pretty typical case of how to tweak ocPortal's templates.

The colors are a different matter - that's all done with CSS and should be pretty easy if you're comfortable editing CSS.


Last edit: by Allen

Back to the top
 
Posted
Rating:
#93939
Avatar

Fan in training

Now in Ocportal 9.0.4
How can do this, header.tpl doesn't exist…
I modify global_html_wrap, but doesn't happen
Which are the new files to edit?
Back to the top
 
Posted
Rating:
#93951
Avatar

Community saint

Have you cleared the caches after changing, mostly this is the problem.


http://digiflash.nl Photo community  (dutch)
Back to the top
 
There are too many online users to list.
Control functions:

Quick reply   Contract

Your name:
Your message: