Search Results for 'COLUMNS'

[Ben Ritner]

Ben Ritner

#131088

I’ve been thinking… You can approach this a little differently without a child theme if you only need three columns in the footer. You can set the columns to 4 then in the 4th column add what you you want to be below the columns. Then you could make it all work with css that is less invasive. But you would need to add that change then post a link.

Ben

[Ben Ritner]

Ben Ritner

#131055

1. Your issue with pagebuilder was simply that you have conflicting css.. You set the height of the row to 250. Then set the height of each widget to 250. ON mobile the columns drop down to be one after the other. Making your row 500px but because you manually set it to 250px it was overlapping.. I’ve removed the row height setting as it wasn’t needed.

Next you can see that in your text row you have set a padding of 50px on all sides. That means 50px on top and bottom. Which means 100px of your set 250px height is not accessable to your text. But on mobile your text alone is 275px… That of course means your now overlapping….

The thing is the theme doesn’t control the css you add and if you add css that is not responsive in nature it’s not about the theme being responsive but your code.

Whats important for you to consider is not setting anything as defined absolutes. So for example instead of setting the height to be a static 250px which is not responsive. You can set the height to be at least 250px thus allowing it to grow if the content needs the space. For this you can use “min-height:250px”

I updated the page with this and you can see the page working now.

2. First no error in code that you can see in the source (meaning it’s able to be output) would cause a 500 internal error. Interal means it’s breaking php. So your issue is most likely coming from your php settings. like your hitting your max memory or something else of that nature. Best thing for you to do is check your error logs.

In terms of the extra ” I removed it.

Ben

[Bill]

Bill

#131030

Hello,

I was trying over the past few days to create a row (using page builder by SiteOrigin) just beneath the header area. For the row, I selected “full Width Stretched” and divided it into two 50% columns. In the left column I placed an image, also giving it the “stretched” option and limiting its height to 250px. I also gave it the parallax option. In the right-side column I simply added a solid background color and a small paragraph of text.

At full width, it looked great! However, when reducing for tablet and phone, the text was pushed down over the top of a data-table that sat below it. That’s when I realized that no matter how I did it, if there is text placed in a row under the header, it will “always” slide over the top of anything beneath it.

I have tried adding text to a text widget, I’ve placed it inside a table, I tried layering it over an image, I even tried just typing it directly into the visual editor widget and placing it under the header of the page. Regardless of how you do it, the text will override anything beneath it when the view-port is shrunk down.

I assumed that the theme was designed to be responsive. Am I missing something here? Is there another technique I should be using? Please help!

Thanks,

Bill

[Bill]

Bill

#131030

Hello,

I was trying over the past few days to create a row (using page builder by SiteOrigin) just beneath the header area. For the row, I selected “full Width Stretched” and divided it into two 50% columns. In the left column I placed an image, also giving it the “stretched” option and limiting its height to 250px. I also gave it the parallax option. In the right-side column I simply added a solid background color and a small paragraph of text.

At full width, it looked great! However, when reducing for tablet and phone, the text was pushed down over the top of a data-table that sat below it. That’s when I realized that no matter how I did it, if there is text placed in a row under the header, it will “always” slide over the top of anything beneath it.

I have tried adding text to a text widget, I’ve placed it inside a table, I tried layering it over an image, I even tried just typing it directly into the visual editor widget and placing it under the header of the page. Regardless of how you do it, the text will override anything beneath it when the view-port is shrunk down.

I assumed that the theme was designed to be responsive. Am I missing something here? Is there another technique I should be using? Please help!

Thanks,

Bill

[Sharon]

Sharon

#130801

Thanks Hannah. Working on each one. On …
“3. That would require adding a function into a child theme. You could possibly style with css if you added the text to one of your columns. Let me know if you want to go this route and I can try to work up some css.”

I created a VP child and am working in it right now. Please offer a code to add.

“4. Increase content margins on pages so they are not so close to edge.” code worked for left margin but not right margin. Also, the page titles are not lined up with indented margin.

“5. I believe cyclone slider 2 and pro are the same. Where exactly are you getting stuck? There are lots of youtube tutorials out there for this plugin.”
I have many cyclone slider slideshows (i.e. [cycloneslider id=”general-meeting-programs”]). What will happen to slideshows if I uninstall CS2 and install/activate your CSPro plugin?

Thanks. Sharon

[Kevin]

Kevin

#130784

Hey Emily,

One option to have a multiple column dropdown menu is to use this plugin:
https://wordpress.org/plugins/megamenu/

I suggest reading through the plugin documentation so that you’re sure it’s being configured properly.

If I remember correctly, you need to be sure that you’re assigning your primary navigation to be a mega menu, and then you can set the dropdown menu to display in columns. The plugin documentation will explain this better.

Let me know if this is helpful!

-Kevin

[Hannah]

Hannah

#130728

Hi Sharon,

1.

#nav-second ul.sf-menu>li {
    width: 10.5%;
}
.navclass {
    background: #000000;
    border-top: 2px solid #eea91f;
    border-bottom: 2px solid #eea91f;
}

2.

@media (min-width: 992px) {
aside#ktsidebar {
    width: 20%;
}
.main.col-lg-9.col-md-8 {
    width: 80%;
}
}
.sidebar h3 {
    background: #eea91f;
    padding: 2px;
}

3. That would require adding a function into a child theme. You could possibly style with css if you added the text to one of your columns. Let me know if you want to go this route and I can try to work up some css.

4.

.entry-content {
    padding: 0 15px;
}

5. I believe cyclone slider 2 and pro are the same. Where exactly are you getting stuck? There are lots of youtube tutorials out there for this plugin.

Hope that’s helpful!

Hannah

[Cheri]

Cheri

#130647

Is there a way to have the background of a widget be semi-transparent so type is legible over a background image?

for example: ventresca.com – top row has a background photo that displays full-width. The information within was created using layout builder with 3 rows to enable the top & bottom rows as one-column, and the middle rows as two-column. However, type is hard to read when scaled to mobile view. Is it possible to make the background of the 2 columns be 50% white?

I have found several instances where I wish I could do this, but don’t know how. It would be awesome if when you assigned a background color, you could also assign the opacity.

[Cheri]

Cheri

#130647

Is there a way to have the background of a widget be semi-transparent so type is legible over a background image?

for example: ventresca.com – top row has a background photo that displays full-width. The information within was created using layout builder with 3 rows to enable the top & bottom rows as one-column, and the middle rows as two-column. However, type is hard to read when scaled to mobile view. Is it possible to make the background of the 2 columns be 50% white?

I have found several instances where I wish I could do this, but don’t know how. It would be awesome if when you assigned a background color, you could also assign the opacity.

[Ben Ritner]

Ben Ritner

#130615

2. Just so you know you can change how and when columns break down in your settings > pagebuilder.

Ben

[Kevin]

Kevin

#130579

An easy way to do this is to use shortcode. You can add shortcode to your home page content area to pull your portfolio posts to the front page. The shortcode will look like this:
[portfolio_posts orderby=date excerpt=false columns=4 items=10 height=200 lightbox=true showtypes=true]

Place that into a text editor on your home page content and let me know if it works for you. Be sure that you have page content enabled in Theme Options> Home Layout.

Does this work for you?

-Kevin

[Ben Ritner]

Ben Ritner

#130356

You can change the columns setting. That changes the set width.

As it’s not intended to be a shortcode that just outputs one item it’s not going to have a setting like you are thinking.

Ben

[Mike]

Mike

#130074

Hi;
I’m working on developing a page where I have a photo with a quote alongside and 3 images below for navigation icons with text beneath them.

I haven’t put the navigation in yet as I want to get eh display right first.

I was hoping that when it displayed on mobile it would resize the images and text so they were still on one line (important).

Is there a way of making the text and images responsive to different devices?

Here is the code in the page:

[space_20]

 
<h4></h4>
 
<h1>”It has helped me tremendously”</h1>
 

 
<h4></h4>
[hr]
<h3>Dave Gray Founder of Xplane</h3>
 

[columns] [span4]

<h4>Solve Your Issues</h4>
[/span4][span4]

<h4> Smooth Your Quest</h4>
[/span4][span4]

<h4></h4>
<h4>Elevate Your Company</h4>
 

 

[/span4][/columns]

 

I would greatly appreciate any guidance on this. I’m fairly web literate so have a child theme set up and can do custom CSS if that helps.

Thanks

Mike

[Mike]

Mike

#130074

Hi;
I’m working on developing a page where I have a photo with a quote alongside and 3 images below for navigation icons with text beneath them.

I haven’t put the navigation in yet as I want to get eh display right first.

I was hoping that when it displayed on mobile it would resize the images and text so they were still on one line (important).

Is there a way of making the text and images responsive to different devices?

Here is the code in the page:

[space_20]

 
<h4></h4>
 
<h1>”It has helped me tremendously”</h1>
 

 
<h4></h4>
[hr]
<h3>Dave Gray Founder of Xplane</h3>
 

[columns] [span4]

<h4>Solve Your Issues</h4>
[/span4][span4]

<h4> Smooth Your Quest</h4>
[/span4][span4]

<h4></h4>
<h4>Elevate Your Company</h4>
 

 

[/span4][/columns]

 

I would greatly appreciate any guidance on this. I’m fairly web literate so have a child theme set up and can do custom CSS if that helps.

Thanks

Mike

[Kevin]

Kevin

#129963

Here’s a quick guide showing you how the portfolio is configured:
https://www.kadencewp.com/creating-a-portfolio-page/

Mainly you want to assign a portfolio grid template to the page under Page attributes, then set it to display in four columns in the portfolio page options.

Does this help?

-Kevin

[camilo jose]

camilo jose

#129886

Hello, thanks for the advice,

Well, I dont know if that is the reason, actually, I think is the way the gallery builds the displaying content and getting messy when I change the display sizes or columns number in mosaic mode. The gallery should present the image. “http://acolombiantraveler.com/wp-content/uploads/pictures/costa-rica/bmx-costa-rica-colombia-camilo-19-600×600.jpg” Which exists, but instead, the galley presents a deformed version of the image: “http://acolombiantraveler.com/wp-content/uploads/pictures/costa-rica/bmx-costa-rica-colombia-camilo-19-120×120.jpg&#8221; which also exists. Maybe I just have to refresh the gallery, but I dont know how.
The auto generated shotcode of my gallery is:

[gallery link="file" type="mosaic" caption="true" masonry="true" width="" height="" size="medium" ids="7651,7960,10140,10139,10145,10544,5681,5777,5778,5779,5781,5782,5783,5790,5791,5792,5793,5794,5796,5797,5798,5800,5801,5804,5805,5806,5807,5808,5809,5810,5811,5813,5815,5816,5818,5819,5820,5821,5822,5823,5824,5827,5829,5830,5831,5833,5834,5836,5839,5840,5841,5844,5845,5848,5849,5850,5852,5854,5855,5856,5860,5861,5785,5786,5787,5795,5803,5784,5789,5799,5802,5812,5814,5825,5837,5842,5851,5853,5857,5858,5859,5862,5847,5835"]

I kept the plugins deactivated and I just ran the regenerate thumbnails plugin You suggested, and a question I want to know is. do you mean clear the cache in the browser? (is what I do) or in wordpress?

thanks

[Tracy]

Tracy

#129670

Thank you very much Kevin. It worked. I do have one more question about that: Instead of listing out all the products in that particular category one row after another, can I have it only one row (about 5 columns) with the arrows on the right and left side to click on for more?

Thank you very much!

Tracy

[Ben Ritner]

Ben Ritner

#129568

Hey,
That isn’t an option for this slider. You can’t have the caption below change the overall height of hte slider based on which slide it’s on. You can only add css to force it to a specific height. Which also doesn’t really work as you are wanting the height to change depending on the screen width as well.

I suggest you make a custom carousel instead with this shortcode. You can add an image and text and link to all however you like.

[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]

[/custom_carousel]

Ben

[ABRAHAM]

ABRAHAM

#129486

Ok paste that into a text widget within the home widget area .

[recent_products per_page=”12″ columns=”4″]

[Ben Ritner]

Ben Ritner

#129396

Hey,
so in your row set the columns to 1. Then add a “layout builder” widget and that will let you add different sets of columns per widget so it’s all in one row.

Ben

[Kevin]

Kevin

#129358

As long as you’re placing all of the columns in the same row, then the parallax background should work. Keep in mind though that when you’re using parallax, your image size needs to be a bit larger since the zoom is different.

You should be able to do a wide split content by placing the split content widget into a fullwidth stretched row. Does that work for you?

-Kevin

[Mark]

Mark

#129350

HI Ben and Hannah!
It’s Mark — sold another theme for you!
this is my client’s support.

Need to know something about PARRALLAX.

If you put a parallax in the background of a ROW, and you want one column to have 3 columns and then the next be like 2
but you want the parallax to go under the whole set of rows, regardless of the columns, can you do that?
I can’t seem to figure that out.
Mark

[Mark]

Mark

#129350

HI Ben and Hannah!
It’s Mark — sold another theme for you!
this is my client’s support.

Need to know something about PARRALLAX.

If you put a parallax in the background of a ROW, and you want one column to have 3 columns and then the next be like 2
but you want the parallax to go under the whole set of rows, regardless of the columns, can you do that?
I can’t seem to figure that out.
Mark

[Hannah]

Hannah

#129257

So I think you’re just referring to normal products, not necessarily products that are “on sale”. I would suggest using a shortcode like this: [recent_products per_page="12" columns="4"]
You can paste that into a text widget within the home widget area. Or else if your homepage is set as a static page you can paste it into the content area.
Hope that helps!

Hannah