4

I am want to create some static product page into a Magento for particular product, i am not able to figuring out the issue how to create a custom product page. The product page design we have is quite different to the default layout in Magento, so i think i need to make a custom layout for the product page and apply that as the default for all products.

I have created custom layout options for a product, but it's just showing same product page with all product

app/design/frontend/rwd/default/layout/local.xml

<catalog_product_view>
    <!-- Allow you to change the global structure of the page -->
    <reference name="root">
        <action method="setTemplate"><template>page/your-custom-layout.phtml</template></action>
    </reference>
    <!-- Allow you to change the content of the product area -->
    <reference name="product.info">
        <action method="setTemplate"><template>catalog/product/your-custom-view.phtml</template></action>
    </reference>
</catalog_product_view>

template/page/your-custom-layout.phtml

<!DOCTYPE html>

<!--[if lt IE 7 ]> <html lang="<?php echo $this->getLang(); ?>" id="top" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]>    <html lang="<?php echo $this->getLang(); ?>" id="top" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]>    <html lang="<?php echo $this->getLang(); ?>" id="top" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]>    <html lang="<?php echo $this->getLang(); ?>" id="top" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="<?php echo $this->getLang(); ?>" id="top" class="no-js"> <!--<![endif]-->

<head>
<?php echo $this->getChildHtml('head') ?>
</head>
<body<?php echo $this->getBodyClass()?' class="'.$this->getBodyClass().'"':'' ?>>
<?php echo $this->getChildHtml('after_body_start') ?>
<div class="wrapper">
    <?php echo $this->getChildHtml('global_notices') ?>
    <div class="page">
        <?php echo $this->getChildHtml('header') ?>
        <div class="main-container col1-layout">
            <div class="main">
                <?php echo $this->getChildHtml('breadcrumbs') ?>
                <div class="col-main">
                    <?php echo $this->getChildHtml('global_messages') ?>
                    <?php echo $this->getChildHtml('content') ?>
                </div>
            </div>
        </div>
        <?php echo $this->getChildHtml('footer_before') ?>
        <?php echo $this->getChildHtml('footer') ?>
        <?php echo $this->getChildHtml('global_cookie_notice') ?>
        <?php echo $this->getChildHtml('before_body_end') ?>
    </div>

</div>
<?php echo $this->getAbsoluteFooter() ?>
</body>
</html>

template/catalog/product/your-custom-view.phtml

<!DOCTYPE html>

<!--[if lt IE 7 ]> <html lang="<?php echo $this->getLang(); ?>" id="top" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]>    <html lang="<?php echo $this->getLang(); ?>" id="top" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]>    <html lang="<?php echo $this->getLang(); ?>" id="top" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]>    <html lang="<?php echo $this->getLang(); ?>" id="top" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="<?php echo $this->getLang(); ?>" id="top" class="no-js"> <!--<![endif]-->

<head>
<?php echo $this->getChildHtml('head') ?>
</head>
<body<?php echo $this->getBodyClass()?' class="'.$this->getBodyClass().'"':'' ?>>
<?php echo $this->getChildHtml('after_body_start') ?>
<div class="wrapper">
    <?php echo $this->getChildHtml('global_notices') ?>
    <div class="page">
        <?php echo $this->getChildHtml('header') ?>
        <div class="main-container col2-left-layout">
            <div class="main">
                <?php echo $this->getChildHtml('breadcrumbs') ?>
                <?php // This left_first block will display above the main content on smaller viewports ?>
                <?php if ($_leftContent = $this->getChildHtml('left_first')): ?>
                <div class="col-left sidebar col-left-first"><?php echo $_leftContent;   ?></div>
                <?php endif; ?>
                <div class="col-main">
                    <?php echo $this->getChildHtml('global_messages') ?>
                    <?php echo $this->getChildHtml('content') ?>
                </div>
                <div class="col-left sidebar"><?php echo $this->getChildHtml('left') ?></div>
            </div>
        </div>
        <?php echo $this->getChildHtml('footer_before') ?>
        <?php echo $this->getChildHtml('footer') ?>
        <?php echo $this->getChildHtml('global_cookie_notice') ?>
        <?php echo $this->getChildHtml('before_body_end') ?>
    </div>
</div>
<?php echo $this->getAbsoluteFooter() ?>
</body>
</html>

2 Answers 2

3

You can follow the bellow steps to create a custom product page layout:

  1. create a new custom theme named like custom product page

  2. add local.xml in layout folder and set layout for "catalog_product_view".

  3. just copy and Add view.phtml in template folder

  4. Customize as per your requirement.

  5. from backed set choose the theme for particular product.

  6. save the configuration and reload the page from front end.

1
  • Thank's for your reply @bhaskar I have created custom layout options for a product and define the layout in local.xml file, but it's showing same product page with all product Commented Jul 28, 2015 at 10:25
2

You can folle the below steps to create a custom product page layout:

create a new custom theme named like cutsomproductpage

add local.xml in layout folder and set layout for "catalog_product_view".

just copy and Add view.phtml in template folder

Customize as per your requirement.

from backed set choose the theme for particular product.

save the configuration and reload the page from front end.
3

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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