Search Results for 'COLUMNS'

[Jay]

Jay

#18006

I had an additional question in this area. The columns stack on top of each other on smaller screens. Is there a way to keep the grid at a smaller screen width?

[Dirk]

Dirk

#17956

Hi Ben,

here’s a classical issue with dynamic grid layouts and initially hidden content. Unfortunately this doesnt work for me in Pinnacle today.
In the post/page editor I insert the Pinnacle Shortcode for TABS and for the second – i.e. initially hidden – tab i query some staff data containing images:

[tabs][tab title="title1" start=open]
Put content here
[/tab][tab title="title2"]
[staff_posts items="-1" orderby="menu_order" columns="2" ratio="square" link="true" cat="JIB"]
[/tab][tab title="title3"]
Copy and paste to create more
[/tab][/tabs]

The second tab doesn’t get displayed properly.
Any chance to fix that soon?

Dirk

( Calling isotope.reLayout() each time the tabs are switched saved my day in other projects… )

[Dirk]

Dirk

#17956

Hi Ben,

here’s a classical issue with dynamic grid layouts and initially hidden content. Unfortunately this doesnt work for me in Pinnacle today.
In the post/page editor I insert the Pinnacle Shortcode for TABS and for the second – i.e. initially hidden – tab i query some staff data containing images:

[tabs][tab title="title1" start=open]
Put content here
[/tab][tab title="title2"]
[staff_posts items="-1" orderby="menu_order" columns="2" ratio="square" link="true" cat="JIB"]
[/tab][tab title="title3"]
Copy and paste to create more
[/tab][/tabs]

The second tab doesn’t get displayed properly.
Any chance to fix that soon?

Dirk

( Calling isotope.reLayout() each time the tabs are switched saved my day in other projects… )

[Ben Ritner]

Ben Ritner

#17811

In your appearance > widgets, you can add whatever widgets you want to the footer columns.

Ben

[Michael]

Michael

#17807

Hi Ben,

thanks. OK, I understand it’s a ccs. That means – more columns – smaller thumbnails.
Your ccs works, but I would prefer to show the caption always visible below the thumbnails.

– something like that – here is a link to my “old” website – http://galaxyphoto.de/NebelGalerie.htm

Which ccs must I add to the ccs box?

Michael

[Nelson]

Nelson

#17758

Thanks for the quick reply, for the first part, I cannot do this (use the homepage slider function) or else the wording will be unilingual. This is the reason I had to setup a Kadence slider in the visual editor and put it on the home page.

this is my code in my static homepage:

[kadence_slider id="1057"]

SNS PRODUCTIONS Aerial Film & Photo
SNS Productions is a registered company with Revenu Québec located in Gatineau QC, and specialized in aerial photography and videography using camera mounted unmanned air vehicles (also known as camera drones). Our clientèle is mainly in the Outaouais region (Gatineau and Ottawa).

[columns]

[span3]  [/span3]

[span3]  [/span3]

[span3]  [/span3]

[span3]  [/span3]

[/columns]

Note the Kadence slider.

[Ben Ritner]

Ben Ritner

#17725

To be clear, css is what was posted above, and that isn’t a shortcode, It’s css. I know it’s terms but it’s important because it can be really confusing for us trying to help if your using the wrong terms.

1. The size of your thumbnails will depend on the columns you choose. For example if you choose a four column layout then the thumbnails will be sized to 300 x 300. It’s a responsive theme so those sizes will change as your change the size of your screen.

2. You can add this css to your theme options > advanced styling to change how the captions show.

.kad_caption {
position: static;
background: transparent;
ms-filter: "alpha(Opacity=100)";
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
}

Ben

[Ben Ritner]

Ben Ritner

#17712

1. You just have too much in your topbar. For example, why the category dropdown and the menu? Those can easily be combined.
2. try adding this css:

#topbar-search input[type=text] {
color: #000;
}

3. the css I sent wouldn’t add select category is was already there. and you should remove this css if you are using the background as white.

4.
5. The main menu color is blue when hover, are you wanting the background to change? Check the menu settings.
6. Assuming your have a child theme, copy the templates/header-style-two.php into it and add this in-between line 65 and 66.
<div class="hrule_gradient"></div>
7.
8. add this css:

.prev_carousel, .next_carousel {
ms-filter: "alpha(Opacity=100)";
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
}

9.
10.
11 and 12. You can’t sort the featured and best selling by category. I thought I made that clear I guess not.
You can only show products by category or by featured not both.

So a category carousel would be

[carousel type=cat-products columns=4 items=100 speed=9000 scroll=1 cat=furniture]

Ben

[Mitesh]

Mitesh

#17711

hi Ben,

For 11. and 12., I tried using:

[carousel type=featured-products columns=4 items=100 speed=9000 scroll=1 orderby="product-category"]

The carousal displays products, but products still show up mixed whereas I was expecting them to be sorted by product-category. Couldn’t find much, so any additional info. on it would be great.

The best sellers carousal doesn’t even show up. Below is what is used.

[carousel type=best-selling-products columns=4 items=100 speed=9000 scroll=1 orderby="product-category"]

Mitesh.

[Ben Ritner]

Ben Ritner

#17601

Hey,
1. Your positions issue is caused by your image size, The images are so small they are not large enough for a 4 column gallery. And thus you get a weird layout. If you plan on continuing to use image this small and plan on using a 4 column gallery then here is css to help but I suggest using larger images and you will see that the lays out the columns correctly.

.kad-wp-gallery .grid_item {
border: 0;
text-align: center;
}
.kad-wp-gallery .grid_item img {
border: 1px solid #777;
}

2. In the virtue: gallery widget settings did you turn the captions to show?

3. A gallery is different then images, if you just add 1 image to a page you can edit the style.

Ben

[Mitesh]

Mitesh

#17569

hi team,

I’m working on a few issues for the site’s appearance. Looking for possible solutions:

1. I’m looking to get Search Bar in Top Bar in the same line as Product Categories drop down. Not sure if this is possible.
2. The Search Box in the Top Bar doesn’t show the characters I type (possibly the color is white ). How can we make it to Black color?
3. The font color in the Top Bar Product category Drop down font is showing black. Can we make it white?
4. The arrow color of the top Bar Product category Drop down is gray color. Can we make it white?
5. I was expecting the Menu items to be highlighted in theme color upon mouse hover (top bar as well as main menu)
6. Is it possible to have a gradient seperator immediately below the logo?
7. Menu items are not going on either side of the Logo (4 each side as per selected layout)
8. Is it possible to Change the arrows of carousals [[carousel] to be darker and persistent at all times?
9. Sale tag is not showing up because it is displayed white in color : looking for blue box around sale like in the Virtue theme demo site
10. Looking to get CopyRight Notice in the Center of the Page instead of in the extreme left
11. Below is not working!! I was expecting to see only featured furniture, but am also seeing jewellery products:
[carousel type=featured-products columns=4 items=100 speed=9000 scroll=1 cat=furniture]

However, the on-sale products carousal works fine:
[carousel type=sale-products columns=4 items=100 speed=9000 scroll=1 cat=jewellery]

I tried putting double quotes around, but to no avail

12. Also, below carousal for best selling products wont work
[carousel type=best-selling-products columns=4 items=100 speed=9000 scroll=1 cat=furniture]

Any ideas will be greatly appreciated.

Thanks,
Mitesh.

[Mitesh]

Mitesh

#17569

hi team,

I’m working on a few issues for the site’s appearance. Looking for possible solutions:

1. I’m looking to get Search Bar in Top Bar in the same line as Product Categories drop down. Not sure if this is possible.
2. The Search Box in the Top Bar doesn’t show the characters I type (possibly the color is white ). How can we make it to Black color?
3. The font color in the Top Bar Product category Drop down font is showing black. Can we make it white?
4. The arrow color of the top Bar Product category Drop down is gray color. Can we make it white?
5. I was expecting the Menu items to be highlighted in theme color upon mouse hover (top bar as well as main menu)
6. Is it possible to have a gradient seperator immediately below the logo?
7. Menu items are not going on either side of the Logo (4 each side as per selected layout)
8. Is it possible to Change the arrows of carousals [[carousel] to be darker and persistent at all times?
9. Sale tag is not showing up because it is displayed white in color : looking for blue box around sale like in the Virtue theme demo site
10. Looking to get CopyRight Notice in the Center of the Page instead of in the extreme left
11. Below is not working!! I was expecting to see only featured furniture, but am also seeing jewellery products:
[carousel type=featured-products columns=4 items=100 speed=9000 scroll=1 cat=furniture]

However, the on-sale products carousal works fine:
[carousel type=sale-products columns=4 items=100 speed=9000 scroll=1 cat=jewellery]

I tried putting double quotes around, but to no avail

12. Also, below carousal for best selling products wont work
[carousel type=best-selling-products columns=4 items=100 speed=9000 scroll=1 cat=furniture]

Any ideas will be greatly appreciated.

Thanks,
Mitesh.

[Ben Ritner]

Ben Ritner

#17495

Hey,
1. In your footer I just see a background color, No image?

2. The columns are not really default to center in the footer. So what do you mean? You have a facebook icon for example in your first image. Are you wanting to add css for that to be center in the column? Most likely there is a setting in your plugin that would allow you to center.

Are you wanting the bullet point list to be center and not left aligned?

For that you can add this css but I don’t think it looks very good.

.footer-widget li {
    text-align: center;
    list-style-position: inside;
}

Ben

[Andy]

Andy

#17454

Hi, Need your support for several topics.

– I have added a footer image and looks great on my macbook and ipad. But not on iphone5, there the image is cut in a strange way. How to get this in line?!
– Also saw that the footer 4 columns are not centred on my macbook anymore, how to resolve this?

*Login to see link

Andy

[Andy]

Andy

#17454

Hi, Need your support for several topics.

– I have added a footer image and looks great on my macbook and ipad. But not on iphone5, there the image is cut in a strange way. How to get this in line?!
– Also saw that the footer 4 columns are not centred on my macbook anymore, how to resolve this?

*Login to see link

Andy

[Ben Ritner]

Ben Ritner

#17432

So you want the images on your home page to be four columns on a mobile phone?

add this:

.homecontent #panel-grid .panel-grid-cell {
width:25%;
float:left;
}

Ben

[Jessica Santini]

Jessica Santini

#17423

Hello,

I recently downloaded Virtue premium for the sole purpose of the blog grid feature. LOVE the way it looks with multiple columns. I have a lifestyle blog which is divided up into categories and then subcategories. (Food> Breakfast, Fashion> Trending, etc.) http://www.bigcitylittleblog.com

In the past, I’ve created a menu out of categories/subcategories for readers to click on, but hated the way it would populate. I’m confused about how to get the results I want.

Should I create a “blog grid” page for each category and, if so, how do I make it populate only a selected category? (Just the cat: “Food” or just the sub-cat: “Breakfast.”)

OR… there a way to keep the category links in the menu the way I have it now, so that when you click on them it populates into a “blog grid.” I’ve found other widgets that are similar, but they don’t have columns. It seems like a waste of space.

Any help would be appreciated!! I can’t seem to find ANY guides or instructions on what I’m looking for.

Hopeful,
-Jess

[Jessica Santini]

Jessica Santini

#17423

Hello,

I recently downloaded Virtue premium for the sole purpose of the blog grid feature. LOVE the way it looks with multiple columns. I have a lifestyle blog which is divided up into categories and then subcategories. (Food> Breakfast, Fashion> Trending, etc.) http://www.bigcitylittleblog.com

In the past, I’ve created a menu out of categories/subcategories for readers to click on, but hated the way it would populate. I’m confused about how to get the results I want.

Should I create a “blog grid” page for each category and, if so, how do I make it populate only a selected category? (Just the cat: “Food” or just the sub-cat: “Breakfast.”)

OR… there a way to keep the category links in the menu the way I have it now, so that when you click on them it populates into a “blog grid.” I’ve found other widgets that are similar, but they don’t have columns. It seems like a waste of space.

Any help would be appreciated!! I can’t seem to find ANY guides or instructions on what I’m looking for.

Hopeful,
-Jess

[Ben Ritner]

Ben Ritner

#17296

hmm, it’s trick, you can do it though. Add this to a text widget in one of your footer columns:

<script type="text/javascript">
jQuery(document).ready(function ($) {
var topOffest = $('body').hasClass('admin-bar') ? 32 : 0;
$('#nav-main').sticky({topSpacing:topOffest});});
</script>

Then add this to your custom css box:

#nav-main {
width: 100%;
margin: 0 auto;
left: 0;
padding-bottom: 10px;
padding-top: 10px;
background: #f1f1f1;
}
#nav-main-sticky-wrapper > #nav-main .sf-menu > li {
	display: inline-block;
	float: none;
}
#nav-main-sticky-wrapper > #nav-main ul.sf-menu {
float: none;
text-align: center;
}

Ben

[Ben Ritner]

Ben Ritner

#17271

Hey,
Yes the theme resizes images to fit what it’s begin used for, this makes for much faster sites when images are cropped to the size needed.
The theme options version of the image menu crops the image based on the size need, (how many columns and set height). Since the widget doesn’t know where it’s being placed and how wide it will need to be it doesn’t crop the image.

The blog posts feature images will all be cropped to fix the size that is needed.

Ben

[Daniel]

Daniel

#17092

Hi Ben,

do you have a hint for me how to/where to change the (a) pagewidth?

In Stylesheet.css I only see (see below)

I tested a plugin, to no avail

the site is *Login to see link

Thank you so much!!

And congrats for your new theme!!

Dan

/*
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.5.9
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
*/

[Daniel]

Daniel

#17092

Hi Ben,

do you have a hint for me how to/where to change the (a) pagewidth?

In Stylesheet.css I only see (see below)

I tested a plugin, to no avail

the site is *Login to see link

Thank you so much!!

And congrats for your new theme!!

Dan

/*
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.5.9
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
*/

[Ben Ritner]

Ben Ritner

#17074

Not without editing code in the theme. I think you might be better off just creating a custom carousel using this shortcode:

[custom_carousel columns=1 speed=9000 scroll=1]

[carousel_item columns=1]
Item 01 - Add your info here
[/carousel_item]

[carousel_item columns=1]
Item 02 - Add your info here
[/carousel_item]

[carousel_item columns=1]
Item 03 - Add your info here
[/carousel_item]

[carousel_item columns=1]
Item 04 - Add your info here
[/carousel_item]

[/custom_carousel]

Ben

[Ben Ritner]

Ben Ritner

#16880

You can use the theme columns shortocodes like this:

[columns] [span4 phone="span3"]

add content here

[/span4][span4 phone="span3"]

add content here

[/span4][span4 phone="span3"]

add content here

[/span4][/columns]

Ben

[Hannah]

Hannah

#16778

Hi Dmitry, that actually is how the theme is set up. Virtue is fully responsive meaning the content will adjust to the screen size. If you look here: http://themes.kadencethemes.com/virtue-premium/ and make the screen size smaller you will see the footer columns falling under each other.
If you want to keep three columns on ipad views you can try this code:

@media (min-width: 760px) {
.footercol3 {
clear: none;
}
}

Just paste it into your custom css box in theme options > advanced settings.
Hope this is helpful!
Hannah