7 replies to this topic

[cf666]

How do I achieve the attached layout?
Looks pretty simple, right?
Only that:

1) how do I control the boxes individually?
How do I assign different background colors to each one and have fine control over the type (notice the diff line heights, font sizes, etc)?
And include two buttons in each ("info" and "book now" in attached layout comp)?
And specify that black area around the color boxes?
All of this is should be simple enough to do in straight CSS but in PageLines... ????

2) then there's the header customization: how do I have a line of text above the nav bar, customize the type and background color in the navbar, the LOCATION of the navbar, and include the language flag icons in it?

I'd so appreciate help with this...
Thank you in advance!

Attached Files

•  TEMPLATE.jpg   150.31K  55 downloads

[Danny]

Hi,

1. This layout including the different backgrounds, control over the type can be achieved with custom CSS. When you create a Box in the Meta settings, you can apply a custom class to each box, which allows you to target that specific box and apply CSS.

The buttons, you can create via the PageLines shortcodes in the Box content editor area upon creating your box.

2. The Navbar color can be changed either via the options where you can choose the color scheme or you can apply custom CSS to change the background color.
The type can also be changed via custom CSS also.

The Location of the Navbar can be changed via our Drag and Drop system. However, the NavBar section is only available in the Header Template, you can change this by creating a child NavBar section and editing the Workswith line, in the section.php.

Adding country flag icons, would require a hook, I recommend you install the ActionMap plugin via the PageLines Store. Once installed/activated, if you refresh your website, a new link will appear in the Wordpress admin bar in the top left called ActionMap. Clicking this will display all available hook locations.

You can then use this to create your hook.

[cf666]

Hi Danny,

Thank you for your reply, yes, I've been trying some of that with the PL Customize plugin but as far as the boxes, I'm getting weird results:
- on pages where the template has a sidebar (and therefore less room for the content area where the boxes are) they get all squished together and they overlap.
- on other pages where the boxes can run the whole width of the page because there's no sidebar taking up space, the spacing between boxes is all weird, and the padding in each box, although I specified the same for all, renders different for each box and horizontal padding doesn't come out same as vertical, although it is specified the same for both h and v.
- the title for each box only appears INSIDE the box when I take out the div I put inside each box to specify a class for each one, and instead enter a class name in each individual box's meta settings (Boxes Custom Class) as I did for the "calafate Classic" box on the far right. But when I do that I lose the styling that I specified for the box set's class. How do I solve this??
- I still don't know how to enclose the entire group of boxes in a black box with the title "Check out our Package Specials!" as in the layout comp.
- what's the syntax (and where do I write it) to change the font for the type ONLY in the boxes? the typography settings in the PL dashboard assign the same typeface for the boxes AND the body text, which is not what I want. How do I control this?

the header issue seems so over my head I don't even know where to start.

PLease take a look at it at:

Please Login or Register to see this Hidden Content

Thanks so much!

[Rob]

Okay, on the boxes thing.... I strongly recommend you install

Please Login or Register to see this Hidden Content

which replaces our standard boxes with "content blocks". These are exactly the same as boxes, but handled differently, avoiding lots of problems. The plugin allows you to customize extensively. You can put it into a content box in a page, which would allow you to create the background you want as well. I use this on my site

Please Login or Register to see this Hidden Content

The Boxer content blocks are added by shortcode.

Check the "Recent Activity" that might help you see how it's done.

[cf666]

Alright! Thanks Rob, I just got the plugin so I'm gonna try it out... Let's see what happens!

[cf666]

oops... never mind.
I posted a frustrated "heeeelp!" message but I think I'm finding my way around this...
Thank you!

[cf666]

Ok, no, I'm still having trouble. More than this is worth, it seems - like I would have probably finished this in straight CSS than trying to figure out pageLines AND now this WP Boxer thing!! aaaargh!!!
Anyway, the layout of my boxes in WP Boxer still gives me grief: how do I control the spacing between them? Also, they're supposed to stretch responsively and they do the weirdest stuff when the browser window width changes!! Let alone the different heights of the boxes which looks like crap. I also would like to insert my own buttons to resemble what I have on my comp, (see attached to my first post in this thread, above) and I don't want them to break into two lines but be next to each other on the same line.

Also: I have placed the WP Boxer "Block Group" inside a PL Box, and I gave the box a custom class name of "new-boxes"
I then put in this custom code (using the PL Customize plug in):

.new-boxes {
background-color:#000000;
color:#FFFFFF;
}

The background color did take, but I can't get that box Title ("CHECK OUT OUR PACKAGE SPECIALS!") to show in WHITE!!

Any help would be greatly appreciated...
Thanks in advance.

The site in questions is at:

Please Login or Register to see this Hidden Content

[Danny]

Hi,

The WP Boxer plugin shouldn't be placed inside the PageLines boxes as far as I am aware, but added to your post/page content editor.

We can not provide support on how to use the WP Boxer plugin as this is not our product, I recommend you contact you the plugins author for assistance.