0

I just set up two custom tabs ["Technical Data" and "More Info"] for my site with the help of this link and using the following codes.

Added the following Blocks after Description block in /app/design/frontend/default/mytheme/layout

technicaldata block

<block type="catalog/product_view_attributes" name="product.technicaldata" as="technical" template="catalog/product/view/technicaldata.phtml">
                <action method="addToParentGroup"><group>detailed_info</group></action>
                <action method="setTitle" translate="value"><value>Technical Data</value></action>
</block>

moreinfo block

<block type="catalog/product_view_attributes" name="product.moreinfo" as="moreinfo" template="catalog/product/view/moreinfo.phtml">
                    <action method="addToParentGroup"><group>detailed_info</group></action>
                    <action method="setTitle" translate="value"><value>More Info</value></action>
</block>

Added the following PHTML files in

/app/design/frontend/default/mytheme/template/catalog/product/view

technicaldata.phtml

<?php $_helper = $this->helper('catalog/output'); ?>
<?php $_product = $this->getProduct(); ?>
<?php if ($_product->gettechnicaldata()):?>
                <div class="short-technicaldata">
                    <div class="std"><?php echo $_helper->productAttribute($_product, nl2br($_product->gettechnicaldata()), 'technicaldata') ?></div>
                </div>
            <?php endif;?>

moreinfo.phtml

<?php $_helper = $this->helper('catalog/output'); ?>
<?php $_product = $this->getProduct(); ?>
<?php if ($_product->getmoreinfo()):?>
                <div class="short-moreinfo">
                    <div class="std"><?php echo $_helper->productAttribute($_product, nl2br($_product->getmoreinfo()), 'moreinfo') ?></div>
                </div>
            <?php endif;?>

Added technicaldata and moreinfo as an attribute and then assigned it to the product.

Now on the front end i am getting an empty space before my data is displayed. However this empty space shows up only in my Technical Data tab and not on More Info tab. How can i remove this empty space and what was my mistake?

In the Technical data tab i have inserted a table using the <div class="table wrapper"> to make my table responsive whereas in More Info tab i have just entered a single line of data giving the brands dealt.

  • Update - Normal text is displayed properly however as soon as i add a table empty space is displayed before the actual table. This issue is faced even after removing the table wrapper div. – H.A. Jul 29 '15 at 7:47
0

Inspect the CSS for collapsing margins.

A possible workaround is to add a small padding-top value to the wrapping div.

|improve this answer|||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.