Search Results for 'COLUMNS'

[Ben Ritner]

Ben Ritner

#22312

You would have to use the portfolio shortcode instead of the page template if you want to have any content below the grid.
So you would use the fullwidth template instead and it would look like this:

[portfolio_posts columns="3" items="12"]

Ben

[arsene]

arsene

#22235

Hi,
Is it possible to customize the style.css file ?
Cause it’s possible in other themes but not in virtue premium.
I bought the premium version and I’ll be very glad if somebody can explain to my how I can do this.

Normaly in the other’s themes style.css files, I can see all the lines and I can change all I want.
BUT in the virtue premium’s theme style.css I can see just that :

/*
Theme Name: Virtue – Premium
Theme URI: *Login to see link
Description: The Virtue theme is extremely versatile with tons of options, easy to customize and loaded with great features. The clean modern design is built with html5 and css3 and uses the powerful responsive framework fro Bootstrap to be a fully responsive and mobile friendly. It’s fully ecommerce (Woocommerce) ready with all the tools you need to design an awesome online store. The versatile design is perfect for any kind of business, online store, portfolio or personal site. We built Virtue with a powerful options panel where you can set things like your home layout, sliders, custom fonts, and completely customize your look without writing any CSS. You are going to love how easy this theme is to work with. Virtue was built and designed by Kadence Themes.
Version: 2.7.0
Author: Kadence Themes
Author URI: *Login to see link
Tags: flexible-width, two-columns, one-column, custom-colors, custom-header, custom-menu, featured-images, translation-ready, theme-options, photoblogging

License: GPL
License URI: *Login to see link
*/

Thank you for you help,

[arsene]

arsene

#22235

Hi,
Is it possible to customize the style.css file ?
Cause it’s possible in other themes but not in virtue premium.
I bought the premium version and I’ll be very glad if somebody can explain to my how I can do this.

Normaly in the other’s themes style.css files, I can see all the lines and I can change all I want.
BUT in the virtue premium’s theme style.css I can see just that :

/*
Theme Name: Virtue – Premium
Theme URI: *Login to see link
Description: The Virtue theme is extremely versatile with tons of options, easy to customize and loaded with great features. The clean modern design is built with html5 and css3 and uses the powerful responsive framework fro Bootstrap to be a fully responsive and mobile friendly. It’s fully ecommerce (Woocommerce) ready with all the tools you need to design an awesome online store. The versatile design is perfect for any kind of business, online store, portfolio or personal site. We built Virtue with a powerful options panel where you can set things like your home layout, sliders, custom fonts, and completely customize your look without writing any CSS. You are going to love how easy this theme is to work with. Virtue was built and designed by Kadence Themes.
Version: 2.7.0
Author: Kadence Themes
Author URI: *Login to see link
Tags: flexible-width, two-columns, one-column, custom-colors, custom-header, custom-menu, featured-images, translation-ready, theme-options, photoblogging

License: GPL
License URI: *Login to see link
*/

Thank you for you help,

[Ben Ritner]

Ben Ritner

#22132

It is if your images are at least 270 x 270 pixels. You can set the ratio in the theme options > shop settings. and you can change the columns in the featured carousel to say 5 so your images are smaller but your actual upload images need to be a decent size or the theme won’t be able to crop them. Can you post a link.

Kadence Themes

[Ben Ritner]

Ben Ritner

#22104

Hey,
Sadly what your wanting to do isn’t possible. The div that controls your background is the main div for the whole post. You can’t break it to have empty space that shows the background. You can change how the background is applied but thats heading down a long road of hacks.

If you want to have the contact form in have the space and text in the other you can use the built in virtue shortcodes for columns. That still will not take the background away behind it.

Ben

[BG Anders]

BG Anders

#21912

Well it was some form of lazynes, because i added all in Pagebuilder via visual editor.

I made all again from scratch using no pagebuilder or visual editor, only simple text code in 3 shortcode columns.
I still can’t get them to align top. What am i doing wrong ? Or isn’t this the best approach for this case ?

Thank you,
B.

[Ben Ritner]

Ben Ritner

#21822

You can use the columns, for example add three columns, fill the middle and leave the other two with   in them.

Ben

[susan]

susan

#21742

I have decided to get rid of sub-categories for my product pages. I added my products directly to my primary menu – but the one link “Vintage Scandinavian” which has about 40 products in it, only shows one page with 20 products listed and no additional pages. (the product category is “vintage” the navigation label is “Vintage Scandinavian” which is also the name of the page I created and put the short code on ([product_category category=”vintage” per_page=”20″ columns=”4″ orderby=”date” order=”desc”])

Here is a link to the page *Login to see link

I did have two sub-categories under vintage (vintage cufflinks and vintage tie-bars) but I deleted those categories.

[susan]

susan

#21742

I have decided to get rid of sub-categories for my product pages. I added my products directly to my primary menu – but the one link “Vintage Scandinavian” which has about 40 products in it, only shows one page with 20 products listed and no additional pages. (the product category is “vintage” the navigation label is “Vintage Scandinavian” which is also the name of the page I created and put the short code on ([product_category category=”vintage” per_page=”20″ columns=”4″ orderby=”date” order=”desc”])

Here is a link to the page *Login to see link

I did have two sub-categories under vintage (vintage cufflinks and vintage tie-bars) but I deleted those categories.

[Nicola Crossley]

Nicola Crossley

#21698

Hi,
In answer to your question – for copying reasons – I need this menu on every page…I don’t want o build it from scratch 150 times.
I switched to wide gray and all that did was make the buttons smaller and further apart…

I just want to alter the spacing between the button images and the grey area on the top and bottom as it is too deep. I can only alter the columns – surely there must be a way to adjust the box item spacing in CSS?

many thanks

Nic

[Nicola Crossley]

Nicola Crossley

#21679

Right okay – I have been playing around with it and this is what I have done:
Added a static page as the homepage instead of latest posts
in the page (using pagebuilder) I set up info boxes making 7 columns and putting a button image into 5 of these (so I can have the desired space either side) I made the background grey and then used the CSS you updated for me to make the buttons seems like they are coming towards the screen. However the CSS didn’t work so I just altered it a tiny bit to:
.kad-info-box {
-ms-transform: scale(1,1); /* IE 9 */
-webkit-transform: scale(1,1); /* Chrome, Safari, Opera */
transform: scale(1,1);
-webkit-transition: -webkit-transform .2s ease-in; /* Changed here */
-moz-transition: -moz-transform .2s ease-in;
-o-transition: -o-transform .2s ease-in;
transition: transform .2s ease-in;
}
.kad-info-box:hover {
-ms-transform: scale(1.1,1.1); /* IE 9 */
-webkit-transform: scale(1.1,1.1); /* Chrome, Safari, Opera */
transform: scale(1.1,1.1);
}

Cleared the cache (as you suggested) and boom it works!! woohoo!!!

The reason I wasn’t able to see the pagebuilder items in either ‘visual’ or ‘editor’ was because the page was only a draft – once I published it I could see it in all three modes.

Okay just a couple more questions (so sorry):

This is my test site:
http://www.auntydotsweets.co.uk/
where it says ‘plant hire’ ‘plant hire’ etc in the buttons – how can I alter this so that the space between each button (which is built through pagebuilder using the info box widget) and top and bottom isn’t so large? I really don’t want the buttons much bigger but closer together…

Many thanks

Nic

[Georgios]

Georgios

#21668

Thank you very much for your help Ben, it worked!

What I am trying to do now is change the layout of the 2 columns. I want only image, title and add to cart button to be visible. Any ideas?

Thanks

George

[Nicola Crossley]

Nicola Crossley

#21514

Hi Ben,

Sorry I don’t understand what you mean by the CSS is fine as the CSS is still in there but no matter what I try I can’t adapt the ‘icon box’ in a page using pagebuilder to look like the ‘icon menu’ that I set up in the home layout settings and by using the custom css.

Yes I am using columns – because I want the icon boxes as a menu to be centred on the ‘page’ because now i’ll need to recreate it on every single page and that doesn’t seem possible I have 7 columns with two blank on each side and my five icons in the other columns. BUT I can’t specify size, font, alignment etc. Yes I can alter the size of the columns but not the padding between them. So I still have this problem: “there isn’t any options (that I can see) for size, alignment etc. Also how do I edit the padding between the icons – I set up 7 across so that I will have the desired space either side but the five icons I have in the middle have big gaps inbetween…”

Perhaps these screenshots will help….

I want this icon menu to be centred on the landing page with padding either side – but you say it cannot be done and that I must recreate it as a page using pagebuilder and the icon box widget. So i have this:

http://www.auntydotsweets.co.uk/wp-content/uploads/2014/11/Icon-Menu-Screenshot.jpg

which looks (apart from the white background and it being the entire width of the header) almost perfect. And this:

http://www.auntydotsweets.co.uk/wp-content/uploads/2014/11/Icon-Box-Screenshot.jpg

Is what I end up with. And I don’t understand how to alter the size so that I can actually see the icon – as when I adjust the size it appears to get smaller……

Any help on how to set up the icon box to resemble the icon menu i spent hours perfecting would be awesome. Last question; if i do manage to get this icon box looking right – is there a way to copy the entire code into each page through html? Or do I have to actually set it up from scratch for every single page – as this site has approx 150 pages!!!!

Many thanks

Nic

[BG Anders]

BG Anders

#21508

All the same. This is the Description text and the menu was made on the home page with Pagebuilder, 5 columns, with Virtue Image Menu Widged … if that helps

[Ben Ritner]

Ben Ritner

#21507

The css is fine, are you adding the shortcodes in columns? That will determine the size. When you add a row in pagebuidler you can select how many columns… you need to add a shortcode to each column.

If you make your page a static page you can still use the latest post module to show your posts.

If you want to set up another blog page you can, here is a tutorial: https://www.kadencewp.com/creating-a-blog-page-with-virtue/

There isn’t an option to have a 2 column layout that then turns to a one column 1.

Ben

[Nicola Crossley]

Nicola Crossley

#21497

Hi,

Thank you for getting back to me so quickly – that is a shame.
Ok – no i haven’t cleared my cache I am not 100% on how to do this. Also if I am changing the whole site around so that the icon menu isn’t used on front page but that a page with and icon box in it is being used I am guessing that CSS will not be of use to me….

I have been trying to add my icons through the icon box option (using PageBuilder) but there isn’t any options (that I can see) for size, alignment etc. Also how do I edit the padding between the icons – I set up 7 across so that I will have the desired space in between but the five icons I have in the middle have big gaps inbetween… I also have this CSS to animate the icon menu on the landing page – what would I need to change it to to achieve the same effect please?

.home-icon-item {
-moz-border-radius: 50px;
border-radius: 50px;
border: 2px solid;
box-shadow: 10px 10px 5px #80838a;
}
.home-iconmenu a, .home-iconmenu .home-icon-item {
-ms-transform: translate(0px,0px); /* IE 9 */
-webkit-transform: translate(0px,0px); /* Chrome, Safari, Opera */
transform: translate(0px,0px);
-webkit-transition: -webkit-transform .2s ease-in; /* Changed here */
-moz-transition: -moz-transform .2s ease-in;
-o-transition: -o-transform .2s ease-in;
transition: transform .2s ease-in;
}
.home-iconmenu a:hover, .home-iconmenu .home-icon-item:hover {
-ms-transform: translate(0px,-10px); /* IE 9 */
-webkit-transform: translate(0px,-10px); /* Chrome, Safari, Opera */
transform: translate(0px,-10px);

.home-iconmenu a, .home-iconmenu .home-icon-item {
-ms-transform: scale(1,1); /* IE 9 */
-webkit-transform: scale(1,1); /* Chrome, Safari, Opera */
transform: scale(1,1);
-webkit-transition: -webkit-transform .2s ease-in; /* Changed here */
-moz-transition: -moz-transform .2s ease-in;
-o-transition: -o-transform .2s ease-in;
transition: transform .2s ease-in;
}
.home-iconmenu a:hover, .home-iconmenu .home-icon-item:hover {
-ms-transform: scale(1.1,1.1); /* IE 9 */
-webkit-transform: scale(1.1,1.1); /* Chrome, Safari, Opera */
transform: scale(1.1,1.1);
}

Last question:
If i set the homepage to a static page, that has the icon box set up within the page – can I make it a blog page so that the latest posts are displayed. And is there an option to have say 2 columns followed by 1? So you’ve got two posts side by side, then one full width underneath.

Many thanks

Nic

[Kaval]

Kaval

#21467

I just adjusted the last post as you replied. Please see the second paragraph of that.

Maybelline and Mascara in the middle two columns are as far as I can see – there are many more entries below those that are off screen – as in no space to be able to see them, hover over the “shop” and use arrow keys to scroll down you’ll see what I mean.

Checked your example, I want it that way, except there appears to be a limit to what I can display there.

[Ben Ritner]

Ben Ritner

#21465

I don’t see anything off the page, you will want to rearrange how you have the items listed, did you clear your cache?

The first level of submenus are the column header, the second are the columns content.. you can see an example on the pinnacle theme, which uses a similar menu system: http://themes.kadencethemes.com/pinnacle-premium/

Hover over features.

Ben

[Ben Ritner]

Ben Ritner

#21455

in the menus page, click on shop and choose the “Enable Fullwidth Sub-Menu”
You can set the columns to 4.

Ben

[Ben Ritner]

Ben Ritner

#21452

1. I’m not totally sure what you mean but you can try this css:

.home-promo {
max-width: 70%;
margin: 0 auto;
}

2. Not if added through the theme options, if you use pagebuilder to set up your page you can set a background for each row, see here: https://www.kadencewp.com/using-page-builder-virtue-premium/

3. You can click “virtue shortcodes” and add icon menu items anywhere. Just to be clear you will want to use pagebuilder to set up your columns first then add an shortcode to each.

Ben

[Kaval]

Kaval

#21441

Thanks Ben,

OK I am playing around with things and in trying to work out things, was wondering if I could do something like the following:
If you go to boots . com
Hover over “beauty”
All that stuff appears underneath.

Now I am currently messing around with the menus, and so you should see under “shop” on our website that a submenu appears, some of these like have further sub menus, some of which end up off the page!

So I would like it to have the 4 or maybe 5 columns on there, like the boots one, not go off screen, perhaps each 1st level submenu to be in a separate column on the hover (with they’re submenus underneath them).

Thoughts appreciated.
Kav

[Ben Ritner]

Ben Ritner

#21380

1. Do you have a live link? you set the columns in the theme options > shop settings right?

2. It would require that you edit the template file. The virtue_premium/woocommerce/single-product/related.php

line 17.

change: else if ($product_related_column == '6'){ $md = 6; $sm = 4; $xs = 3; $ss = 2;}

to: else if ($product_related_column == '6'){ $md = 9; $sm = 6; $xs = 3; $ss = 2;}

Ben