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.


Theming the news box

Login / Search

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

Well-settled

Hi,

I'm slowly getting there with my minimalist theme but a need some help.

In the News on the front page I want to do 4 things:

1: Get rid of the thin border surrounding the box

2: Remove the picture of whoever posted the story

3: Move the posted by name to beside the date, so it says Posted at 9.38 by Admin, for example.

4: (And this is probably the trickiest) I have two pictures on the news story as thumbnails, that if I click on pop up in new tabs. How do I dictate the size of these thumbnails, as I'd like them larger.

Thanks in advance!

How does everyone know what they need to edit in order to do what they want? When I make an edit I can see the effect, but I'd prefer to be a bit more targeted!
Back to the top
 
Posted
Rating:
#53210
Avatar

Well-settled

I'm getting there!

I've found Firebug for Firefox, and that has answered my last question, and helped with 1.

However, 2, 3 and 4 are still outstanding.  For 4, I have discovered the attachment width in the CCs file, but this doesn;t seem to do anything.  I'm guessing the script that creates a thumbnail is specifying a specific width, which i would like to make larger.  Where would I find this script?

For 2 and 3, I can hide them by fiddling with the CSS, but ther'yr still really there, you just can't see them.  How do I make it so that it never even attempts to show the picture, and writes 'by admin' beside the date?

And why does it look good in Opera, firefox and IE8, but still have borders in IE6?
Back to the top
 
Posted
Rating:
#53211
Avatar

Well-settled

Loving ocPortal, by the way - in a few hours I had the site looking about 90% of what I wanted!
Back to the top
 
Posted
Rating:
#53241
Avatar

Honoured member

Would love to see what you've done.

Would you mind sharing a link to you site?

And check this thread out for the modifications your looking to do.

ocPortal.com - View topic: Start page similar to WordPress
Back to the top
 
Posted
Rating:
#53248
Avatar

Well-settled

Hi,

I would show you my site - except I've just mucked it up - big time.

I want to have the news summary taking up the left 60% of the front page, and then Image of the day and Coming soon in a column on the right 30%.

I did this with a table, but the spacing was messy, so I thought I'd try CSS.  However, I don't think that's the answer now, as that's a global change, and I just want to change these elements without mucking up the rest!  Help!
Back to the top
 
Posted
Rating:
#53249
Avatar

Well-settled

I think I understand now!  Instead of tinkering with the current divs, I've created two new divs in global.css, and assigned them to the blocks I'm trying to move on the front page only!

I'm learning so much.  2 days ago I didn't even know what a css was!

Thanks for the link ocPortal_Noob - I've got rid of the picture.  Now which bit of the code defines that it shows 'Admin' or 'John Smith' or whatever, so I can put it beside the date?

Back to the top
 
Posted
Rating:
#53288
Avatar

Honoured member

It's all in the same link I gave before.

The particular code for showing the author info is

<div class="news_by">
            {!BY_SIM
PLE,<a href="{AUTHOR_URL*}" title="{!_AUTHOR,{AUTHOR*}}">{AUTHOR*}</a>}
         </div>

Back to the top
 
Posted
Rating:
#53289
Avatar

Honoured member

I guess the better way to approach it is the ocPortal way like this

Code

{+START,IF_NON_EMPTY,{AUTHOR_URL}}
<div class="news_by">
{!BY_SIMPLE,<a href="{AUTHOR_URL*}" title="{!_AUTHOR,{AUTHOR*}}">{AUTHOR*}</a>}
</div>
{+END}

{+START,IF_EMPTY,{AUTHOR_URL}}
{+START,IF_NON_EMPTY,
{$USERNAME*,{SUBMITTER}}}
<div class="news_by">
<a class="poster_member" href="{$MEMBER_PROFILE_LINK*,{SUBMITTER}}" title="{$USERNAME*,{SUBMITTER}}">{$USERNAME*,{SUBMITTER}}</a>
</div>
{+END}
{+END}
Check my code there please. But I think this is a more "robust" solution.:thumbs:

cleaned up the code for readability :ninja:
Back to the top
 
Posted
Rating:
#53356
Avatar

Well-settled

Brilliant!  Thanks for the help.

I've nearlycleaned up the mess I made of my site now.  My next thing is those thumbnails!

Where is the parameter that defines their width when they're generated?  I need to make each thumbnail about 280px wide, both when attached to a news story, and when shown as Image of the Day.  (I'd also like to get rid of the fader on iotd, but that's less important.)
Back to the top
 
Posted
Rating:
#53357
Avatar

Community saint

Thumbnails: Admin Zone > Setup > Configuration > Images

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

Well-settled

Thank you!  I can't believe it's an option - I've spent ages looking through all the templates!  And I even found out how to switch the fader off.  Now I'm going to try and get a zoomed image in the news to pop-up, rather than open in a different tab.

(Oh, and anyone know why if I have 2 blocks in a column as floats on the right hand side, the bottom one slightly overlaps the top in IE8 anf FF, but not in IE6?)

(This is sort of turning into a fix-all-my-problems thread!  But at least I now have knowledge to pass on!)

Thanks everyone!

Back to the top
 
There are too many online users to list.
Control functions:

Quick reply   Contract

Your name:
Your message: