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.


Web Layout + ocPortal = Custom Site

Login / Search

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

Fan in action

I have been trying to take a custom web template from any free web template site and intregrate it with ocPortal. So far I have only gotten the CSS to work but not the HTML. I know if I just put all the html down it will but I want to be able to have all the links and features that ocPortal has with it. So I dont know how to get around it.
Back to the top
 
Posted
Rating:
#61770
Avatar

Take a look at the pinned Spring Bloom topic :). I did a walk through.


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

Fan in action

I dont know why but I am still not getting it. I try splitting up the main code in the middle (div="wrapper") into the global.tpl and the header in the header.tpl and footer in footer.tpl but it still doesnt show up right.
Back to the top
 
Posted
Rating:
#61788
Avatar

Community saint

Hey Ryan!

If you didn't do so yet, have a look at Allen Ellis Video Tutorial: View topic: ocPortal themeing video tutorial (EUR-)" ocPortal.com

I found it very useful and enlightening.
Back to the top
 
Posted
Rating:
#61805
Avatar

Fan in action

Thats what I have been watching. I follow exactly on how to do it and cant get the some of the images to show up or the html to work out right.

Are you able to take any html/css web layout and integrate it into ocPortal?
Back to the top
 
Posted
Rating:
#61806
Avatar

Community saint

vtxRyan said

Thats what I have been watching. I follow exactly on how to do it and cant get the some of the images to show up or the html to work out right.

Are you able to take any html/css web layout and integrate it into ocPortal?

If you take from Allen's video the most basic suggestions, you will be able to "massage" a css template into ocPortal by extracting the header code from the template's index.html to ocP's HEADER.tpl; extracting the body/content from the same index.html and inserting it into the new zone front page. Most of the style.css will fit neatly at the bottom of ocP's global.css. Copy all the images into your new Theme/images_custom; change the image source of your code as per Allen's suggestion, and you've got yourself a quick and dirty, but working entire new design into an ocPortal site. It really works. I've done it exactly as described. Once you get it working, it is just a matter of following the integration principles suggested in Chris' tutorial to refine the code and remove what you do not need or edit what is conflicting.
Back to the top
 
Posted
Rating:
#61807
Avatar

Fan in action

I got the header to work somewhat but I am just not getting a lot of this. I have put in most of the HTML into the site but I just get errors or nothing shows up.
Back to the top
 
Posted
Rating:
#61829
Avatar

Fan in action

I am not getting any of the images to show up at all. I have them uploaded to images_custom in the themes folder for that theme
Back to the top
 
Posted
Rating:
#61830
Avatar

Community saint

How are you adding it to the .tpl files?

Eric DeMars . com
My electronic portfolio and personal site. Uses ocPortal!
Back to the top
 
Posted
Rating:
#61831
Avatar

Community saint

Ryan,

The syntax to show images in .tpl files is:

Code

<img src="{$IMG,myimage}">
…And for .css files:

Code (css)

background:url('{$IMG,myimage}');
*replace myimage with your images without the .jpg.gif.png (extension)
Use "Website Cleanup Tools" from admin zone/tools to clear your cache files from time to time if you are adding from ftp
Back to the top
 
Posted
Rating:
#61832
Avatar

What are the errors that you're getting? If you're not using ocPortal's template editor like I show in the video, in other words, if you're editing the .tpl and .css files in another program, then you need to be sure to flush the caches to see the result (holding ctrl+alt+shift while clicking refresh is a nice way to do this in most browsers).

For the images, make sure to replace the URLs with {$IMG,imagenamehere} like Islander said. Or if you're feeling lazy you could potentially use the absolute URL to your image instead. (That's not a great solution for the long run though)

Back to the top
 
Posted
Rating:
#61861
Avatar

Fan in action

Sorry for not responding, I got it figured out. My host ended up not writing the right permissions to a folder. Its all working, sorry for the hassle
Back to the top
 
1 guests and 0 members have just viewed this: None
Control functions:

Quick reply   Contract

Your name:
Your message: