I switched themes yesterday evening and now all of the cart pages are messed up. I've added the paths to css in the theme's header file but it still isn't formatted correctly. See here: http://www.longcreekherbs.com/products.php?cat=12

Mark Newsom
P.O. Box 852
Kimberling City, MO 65686

Hi Mark

The div structure on the new theme will be different and I think that's the problem here rather than the css. What I normally do is look at page.php or sample.php from the wordpress theme and get the div structure from there.

Andy

Please feel free to review / rate our software

I caught that and changed it and it helps some, but the store pages are still messed up. I want the products to be 3 across and they are all over the place with content spilling over and such.

Mark Newsom
P.O. Box 852
Kimberling City, MO 65686

In style.css remove what you have for div.product and replace it with

div.products{clear:left;}
div.product {
width: 32%;
min-height: 250px;
border: 1px solid #ccc;
display: -moz-inline-stack;
display: inline-block;
vertical-align: top;
margin: 5px;
zoom: 1;
*display: inline;
_height: 250px;
padding:6px;
background:#fff;
}

Andy

Please feel free to review / rate our software

Andy:

Thanks! That helped a lot. However, the products seem to be scattered. Also, on smartphones, it's trying to squeeze two columns on a page. Where do I fix that? And one last thing, I have all of the inner pages that are non-store pages formatted with a screened back background so the content can be easily seem with the herb photo background that is site-wide. However, I haven't a clue as to how to add that to the store pages. Without it, some of the text, like the links at the bottom of the products page for pagination are difficult to read on the busy background.

Thanks!

.mark

Mark Newsom
P.O. Box 852
Kimberling City, MO 65686

I think the products look scattered as the descriptions are all different lengths.

You can have a white background for the links eg

div.prodnavigation, div.pagenums{background:#fff;}

Your file style.css isn't set up to be responsive and you need to set div.product to a width of 96% for smaller screen sizes. Add this to the bottom of style.css

@media screen and (max-width: 560px) {
div.product {
width: 96%;
height:auto;
}
}

Andy

Please feel free to review / rate our software

Thanks Andy. I will give that a shot. I am still struggling with formatting the store pages to match the other static pages of the site. For instance, http://www.longcreekherbs.com/search.php looks nothing like http://www.longcreekherbs.com/about-jim-long/ which uses the Divi theme. I am at a total loss as to how to make the store pages look like the rest of the site. Can you point me in the right direction? As always, I really appreciate all you do.

Thanks,


.mark

Mark Newsom
P.O. Box 852
Kimberling City, MO 65686

I think it's to do with the div structure and class names. On the working page you have

<div class="entry-content">
<div class="et_pb_section et_pb_section_0 et_pb_with_background et_section_regular et_pb_section_first" data-padding="|0px|19px|0px" data-fix-page-container="on" style="padding-top: 171px;">
<div class=" et_pb_row et_pb_row_0">
<div class="et_pb_column et_pb_column_4_4 et_pb_column_0 et_pb_css_mix_blend_mode_passthrough et-last-child">
<div class="et_pb_text et_pb_module et_pb_bg_layout_dark et_pb_text_align_left et_pb_text_0">
<div class="et_pb_text_inner">

*****CONTENT********

closing </div>s

Try that on your search page and see what it gives you.

Andy

Please feel free to review / rate our software

Andy:

I changed the search.php page to this and as you can see, it is still really messed up. If I can figure this out, I can fix all of the store pages to look just like the other non-store pages:

<?php
$GLOBALS['ectcartpage']='search';
require('./wp-blog-header.php');
get_header();
?>
<div class="entry-content">
<div class="et_pb_section et_pb_section_0 et_pb_with_background et_section_regular et_pb_section_first" data-padding="|0px|19px|0px" data-fix-page-container="on" style="padding-top: 171px;">
<div class=" et_pb_row et_pb_row_0">
<div class="et_pb_column et_pb_column_4_4 et_pb_column_0 et_pb_css_mix_blend_mode_passthrough et-last-child">
<div class="et_pb_text et_pb_module et_pb_bg_layout_dark et_pb_text_align_left et_pb_text_0">
<div class="et_pb_text_inner">
</div></div></div></div></div>
<?php
$GLOBALS['nobuyorcheckout']=TRUE;
$GLOBALS['noproductoptions']=TRUE;
$GLOBALS['showquantonproduct']=FALSE;
$GLOBALS['showproductsku']="";
$GLOBALS['manufacturerfield']="";
$GLOBALS['showinstock']=FALSE;
$GLOBALS['showproductid']=FALSE;
$GLOBALS['shortdescriptionlimit']=90;
include "vsadmin/inc/incsearch.php";?>

<div class="clear"></div>

<?php get_footer(); ?>

Mark Newsom
P.O. Box 852
Kimberling City, MO 65686

I was thinking more of something like this

<?php
$GLOBALS['ectcartpage']='search';
require('./wp-blog-header.php');
get_header();
?>
<div class="entry-content">
<div class="et_pb_section et_pb_section_0 et_pb_with_background et_section_regular et_pb_section_first" data-padding="|0px|19px|0px" data-fix-page-container="on" style="padding-top: 171px;">
<div class=" et_pb_row et_pb_row_0">
<div class="et_pb_column et_pb_column_4_4 et_pb_column_0 et_pb_css_mix_blend_mode_passthrough et-last-child">
<div class="et_pb_text et_pb_module et_pb_bg_layout_dark et_pb_text_align_left et_pb_text_0">
<div class="et_pb_text_inner">

<?php
include "vsadmin/inc/incsearch.php";?>

</div></div></div></div></div></div>
<div class="clear"></div>

<?php get_footer(); ?>

Andy

Please feel free to review / rate our software

Andy:

I cut and pasted the code you provided into the search.php page and it is still not picking up the formatting from the theme.

http://www.longcreekherbs.com/search.php

.mark

Mark Newsom
P.O. Box 852
Kimberling City, MO 65686

Would you like to send me an email with your FTP details and I'll take a closer look for you?

Andy

Please feel free to review / rate our software

Andy, I emailed you the ftp details. I am hoping once the Search page is figured out, I can use those details to fix all of the other store pages.

Mark Newsom
P.O. Box 852
Kimberling City, MO 65686

Yeah! I see the search page is formatted correctly. Tell me how you did it and I will fix all of the other store pages. Thanks so much!

Mark Newsom
P.O. Box 852
Kimberling City, MO 65686

Is this correct http://www.longcreekherbs.com/search.php

I edited search.php and ectstyle.css

Andy

Please feel free to review / rate our software

Yes, the search page now looks correctly formatted. So, all I need to do is copy the code on the search.php page to the other store pages?

Mark Newsom
P.O. Box 852
Kimberling City, MO 65686

I went back to the Search page and there is a mysterious vertical line to the right of the content area. It goes all the way down to the footer area.

Mark Newsom
P.O. Box 852
Kimberling City, MO 65686

That's right, use the same formatting for all the store pages now and let me know how it goes.

Andy

Please feel free to review / rate our software

I tried copying the search code to products and all of the text for the short descriptions is white and not readable on the boxes around each product. So, I am guessing that is a CSS thing and when I copy over the code from the search page, I will also need to change something in one of the CSS files to make the text readable? Also, what about the vertical line to the right of the search content?

Mark Newsom
P.O. Box 852
Kimberling City, MO 65686

I have fixed that, uploading the same formatting as on search.php and editing ectstyle.css to give you dark text.

Andy

Please feel free to review / rate our software

I am having a lot of issues on smartphones displaying the content correctly. Look at this page on your phone:

http://www.longcreekherbs.com/proddetail.php?prod=030

Mark Newsom
P.O. Box 852
Kimberling City, MO 65686