I have been working on converting a site from Dreamweaver to WordPress. I'm almost finished but having some trouble with the store pages layout.

Here is the way the product page looks right now. https://biotic.com/products.php?cat=8

Obviously there are several issues and I know a lot of it is css - but I don't understand why the header is not showing up on the page? I also don't understand why the main portion of the store section is outside of the main body of the page.

Thanks!

Here is the products.php code:

<?php
$GLOBALS['ectcartpage']='products';
require('./wp-config.php');
$wp->init();
$wp->parse_request();
$wp->query_posts();
$wp->register_globals();
get_header();
?>
<?php
get_sidebar();
?>
<div id="content class="grid">
<p align="center">Order form, promotion, and price are valid only for products sold in the USA. <br>
Shipping cost for USA only. Price in US Dollars.</p>
<center>
$50.00 Manufacturer Rebate<br>
on new feeder purchased from us or any dealers. <br>
Send us a proof of purchase ( invoice, sales receipt, etc ) and if approved, we will mail you a check of $50.00 per feeder.<br>
Call or email for more detail.<br>
(offer valid only for units sold in USA, must be redeemed by May 1st, 2019)
<p> </p>
<center>
Our products are sold at major retailers like: <a href="http://www.pipevet.com/"> Pipestone Vet</a>, <a href="http://www.wefeedcalves.com/"> WeFeedCalves.com</a>, <a href="https://www.premier1supplies.com/"> Premiere 1 Supply</a>, <a href="http://www.agcentralcoop.net/default.htm"> AgCentral Farmer Co-op</a>, <a href="https://www.amazon.com"> Amazon.com</a>. And we also sale direct. (<a href="http://biotic.com/dealers/">Complete dealer list</a> )
<p> <strong>Information on using a Biotic feeder for : <a href="http://biotic.com/calves/">Feeding calves</a>   or <a href="http://biotic.com/lamb/">Feeding lambs</a>    or <a href="http://biotic.com/goats/">Feeding kids</a>. <br>
</strong></p>
<center>
<strong>SALE TO CANADA: Product are not CSA approved. Approval on request. Minimun order required. Call for more information</strong>
</center>
</center>
</center>
<?php
include "vsadmin/inc/incproducts.php";
?>

</div>
<?php
get_footer();
?>

Hi

Comparing the div structure from what you have there to the source code in the about page for example, I don't see anything much in common so I think that is certainly a problem.

The easiest way to get the correct classes and structure is to look at the code of the wordpress page sample.php or page.php from the theme. That will give you the starting point for the store pages.

Andy

Please feel free to review / rate our software

I copied the code from here: https://www.ecommercetemplates.com/wordpress/default.asp#step5

Then I added the text that they want to show above the store section.

Here is what a product page looks like - not bad, but no header on the page. Any ideas? https://biotic.com/proddetail.php?prod=feedingstation

The code from the help page is just an example really, your pages have no sidebar for example but you have one defined in the code. I would take a look at page.php and / or sample.php for the starting point.

Andy

Please feel free to review / rate our software

I've got the products.php page looking much better - but two problems remain:

1) No header on the page.
2) Products with a large image have the "price" and "details" link cut off.

Can you help with that?

https://biotic.com/products.php?cat=9

Where do I find page.php or sample.php?

In every other case where I've converted a site into WordPress, I've used that exact copy and paste for the pages and never had this issue before. In fact, in this thread from last December when I was converting a different site, that is exactly what you told me to do - and it worked perfectly. https://www.ecommercetemplates.com/support/topic.asp?TOPIC_ID=111110

Each theme is different so it wouldn't be possible to provide a div structure with classes that worked for all.

Those 2 pages will be in the theme folder you are using

The product elements are getting cut off due to the height setting being too low in div.product, you can increase that or use some alternative css, see my last post here https://www.ecommercetemplates.com/support/topic.asp?TOPIC_ID=100739

Andy

Please feel free to review / rate our software

Ok, I'm getting there - thanks to your help!

I'm still having a problem with the Quantity on some of the product detail pages.

Here is one where it looks correct: https://biotic.com/proddetail.php?prod=idtek2

Here is one where it is obviously in the wrong place: https://biotic.com/proddetail.php?prod=lactek

I'm guessing it has something to do with the width of the product image?

Please help!

Try this setting in the css file

div.detailquantity{
float:left;
width:98%}

Andy

Please feel free to review / rate our software

Almost perfect - but it's now centered: https://biotic.com/proddetail.php?prod=idtek2

You can add

text-align:left !important;

to the class above.

Andy

Please feel free to review / rate our software

That didn't change anything. The word "quantity" and the quantity box are centered in the middle of the page. I'd like them to be to the left as all the rest of the content on the page.

Here is what I have now:

div.detailquantity{
padding-left:30px;
float:left;
width:98%;
text-align:left !important;
}

div.detailquantitytext{
margin-top:18px;
float:left;
width:45%;
text-align:right;
}

div.detailquantityinput{
margin-top:16px;
float:right;
width:45%;
text-align:left;
padding:0px;
height:55px;
}

Can you change the width on detailquantitytext to 100px instead of the 48%

Andy

Please feel free to review / rate our software

Just wanted to say thank you so much! Your advice, as always, was spot on! I really appreciate the link to the info about the css for products with different size images, that is really helpful and I'm sure I'll be using it again.

Best customer service and tech support around :)

Glad to help

Andy

Please feel free to review / rate our software