Build Your Own Business Website header image

Welcome to our Members Only Forum

You are welcome to view the content on our Forum, just scroll down to view this forum post.
If you like what you find and want to be able to post a question, please check out our subscription options.
Please feel free to search the forum using either the Google Site Search above or the forum search below.

Avatar
Search

— Forum Scope —




— Match —





— Forum Options —





Minimum search word length is 3 characters - maximum search word length is 84 characters

sp_Feed sp_TopicIcon
BYOB Carta Feature Boxes Styling
Avatar
Angelique Berger
Jedi
Members

Community Member
Forum Posts: 239
Member Since:
March 27, 2013
sp_UserOfflineSmall Offline
1
November 26, 2013 - 6:29 am
sp_Permalink sp_Print

First things first, Rick can you give a quickie layman's description between Feature and Query Boxes - a bit confusing?  

What I want to achieve is a front page with three main featured services in a 3 column widgetized fashion.  So I'm guessing that's how Carta is set up already, it seems.  Here's the thing though, I want to just feature three large icon like images or pics, (either way, - say 250-300px square).  I do not want borders around them of any kind, (pretty sure), and then I simply want a title heading or (button) with a title under each one.  I want the image or the button to click through to it's appropriate page.  I don't want a write up in that feature box, and if I must have a button, then i want the ability to custom design it.  Might you have a tutorial for just this subject? 

Thanx Rick!

Avatar
Rick Anderson
Desert Hot Springs, CA
Admin
Forum Posts: 13637
Member Since:
November 8, 2009
sp_UserOfflineSmall Offline
2
November 26, 2013 - 9:38 am
sp_Permalink sp_Print

Angelique - a feature box is just a generic description for a "featured" section on a page.  Twitter calls it a Hero Box.  Other folks have other names.  It essentially defines a space on a page (generally your homepage) that doesn't occur elsewhere on your site that "features" some content.

A Query Box is a Thesis tool for including what WordPress calls "secondary queries" or "secondary loops" within a template.  It allows you to specify what you want to display in that specific box.  I strongly encourage you to watch the part in the Beginner's Guide on Query Boxes.

In Carta what you are describing is what I call "attention boxes".  It is a row of "query boxes" that call attention to a specific page or post.  One page or post per attention box.

The Carta front template has attention boxes built in.  All you need to do is specify which page you wish to display in the Skin Content section.  Again, please watch the videos on how to configure the Attention Boxes in Carta.

The Query box has the built in ability to include or exclude any element of a page that you want.  As you have described it you would want to display only the Headline and the Featured Image.

Avatar
Angelique Berger
Jedi
Members

Community Member
Forum Posts: 239
Member Since:
March 27, 2013
sp_UserOfflineSmall Offline
3
November 26, 2013 - 3:58 pm
sp_Permalink sp_Print

Awesome Rick, Thanks, perfect clarification!  I will hightail it to those videos!

 

Ok, I'm back..new reply question: Show I went into the editor, and in the section for each attention box, I put the headline and excerpt back in the tray as I didn't want to see those on the front page. I left the WP Featured Image and I went ahead and uploaded a 290x290 image in those three pages in the 'set featured image'.  

 

Here's my new problem:  A) the featured image cuts off from the top and bottom, making it rectangular; problem 2: when I click on those front page featured images to travel to their prospective pages I end up with this huge photo above the fold where you can't even see the actual description, (which is especially a problem as i took away the read more and the excerpt and heading from these front page boxes.)  So my question is: could I swap out WP featured image for, either Thesis Post Image or Thesis Thumbnail, (and if thumbnail, can I still have the pic show up between 250-300 squared?  Hope all this makes sense.

Avatar
Rick Anderson
Desert Hot Springs, CA
Admin
Forum Posts: 13637
Member Since:
November 8, 2009
sp_UserOfflineSmall Offline
4
November 26, 2013 - 4:04 pm
sp_Permalink sp_Print

Yes, you can and that would be a simple solution.  However, you can also simply remove the Featured Image box from the page template.

The Featured Image box gives you a range of image sizes to choose from.  The Thesis thumbnail will use whatever image you have put in there and will not resize it (unless you put the image in your Thesis Post Image).

Avatar
Angelique Berger
Jedi
Members

Community Member
Forum Posts: 239
Member Since:
March 27, 2013
sp_UserOfflineSmall Offline
5
November 26, 2013 - 4:38 pm
sp_Permalink sp_Print

So if I swap out WP featured image for, either Thesis Post Image or Thesis Thumbnail, within the tray, how or where do I load the image at that point.

Avatar
Angelique Berger
Jedi
Members

Community Member
Forum Posts: 239
Member Since:
March 27, 2013
sp_UserOfflineSmall Offline
6
November 27, 2013 - 5:29 am
sp_Permalink sp_Print

One last question that occurs to me as I attempt to style out my action box section of the front page is if I want to have each of these thumbnails change on rollover or hover, would I need to create more of a custom menu with a sprite for this section instead of the action boxes or can I make the single pics in those action boxes change on hover some other (easier) way?

Avatar
Rick Anderson
Desert Hot Springs, CA
Admin
Forum Posts: 13637
Member Since:
November 8, 2009
sp_UserOfflineSmall Offline
7
November 27, 2013 - 8:30 am
sp_Permalink sp_Print

The images are loaded on the page edit screen.  If you scroll down far enough you'll find the place to load them.  Of course you will need to remove the Featured Image box and replace it with the appropriate Thesis image box.

If you need a roll over effect then you won't use this system at all.  In that case you would use widget areas with text widgets.

Avatar
Angelique Berger
Jedi
Members

Community Member
Forum Posts: 239
Member Since:
March 27, 2013
sp_UserOfflineSmall Offline
8
November 27, 2013 - 9:51 am
sp_Permalink sp_Print

Ok, so I'll go the widget route, but how do I get the pic to change on hover?

Avatar
Rick Anderson
Desert Hot Springs, CA
Admin
Forum Posts: 13637
Member Since:
November 8, 2009
sp_UserOfflineSmall Offline
9
November 27, 2013 - 3:12 pm
sp_Permalink sp_Print

You were on the right track when you discussed image sprites.  Essentially you need to define a link tag with a background image and then change that image on hover.  You won't be able to do this with an HTML image.  It will have to be a background image.

Forum Timezone: America/Los_Angeles

Most Users Ever Online: 228

Currently Online:
18 Guest(s)

Currently Browsing this Page:
1 Guest(s)

Top Posters:

Keith W Jones: 1434

Brian Tozer: 1004

Carolin: 983

Heidi Hafner: 509

John Cunningham: 423

Reece Morrel: 353

Newest Members:

digitalaerolus

emma62755

sharonmarks

emma80233

Tijs de Jong

Daniel Frey

Forum Stats:

Groups: 8

Forums: 46

Topics: 6999

Posts: 34817

 

Member Stats:

Guest Posters: 6

Members: 6762

Moderators: 2

Admins: 2

Administrators: Rick Anderson, Rick Anderson

Moderators: Pierre Cote, Laura Nugent