Jump to content

How to move this on new products page...

Nick20000
 Share

Recommended Posts

Nick20000 Newbie

Nick20000

Posted
  • Author
Posted
here are my files.

 

 

CSS

============================================================================

#product_list .poverlay {

top:0px;

left:0px;

position:absolute;

display:none!important;

width:100%;

height:100%;

visibility:hidden;

z-index:2;

background:rgba(0,0,0,0.7);

}

 

#product_list {

    border: 1px solid #ebeced;

}

 

#product_list .cartbutton {

margin-left:0px;

margin-top:7px;

display:inline-block!important;

}

 

/*#product_list .dropshadowclass {

border:solid 1px #EFEFEF;

}*/

 

/*#product_list .dropshadowclass:hover {

border:solid 1px #CCC;

-moz-box-shadow:0px 0px 3px #999;

-webkit-box-shadow:0px 0px 3px #999;

box-shadow:0px 0px 3px #999;

}*/

 

ul#product_list {

list-style-type:none

}

 

#product_list li {

text-align:center;

margin-bottom:14px;

/*border:1px solid #eee;*/

-moz-border-radius:3px;

-webkit-border-radius:3px;

border-radius:3px;

padding:10px;

width:131px;

display:inline-block;

vertical-align:top;

margin:5px;

position:relative;

}

 

#product_list li a {

color:#374853;

text-decoration:none;

}

 

#product_list li .left_block {

/*float:left;

        /*padding-top:58px;*/

/*width:15px;*/

clear:both;

}

 

#product_list li p.compare {

position:absolute;

color:#FFF;

width:100%;

background:rgba(0,0,0,0.5);

display:block;

text-align:center;

padding-top:10px;

padding-bottom:10px;

}

 

#product_list li .viewbutton {

position:absolute;

display:block;

width:100%;

padding-top:10px;

padding-bottom:10px;

background:rgba(0,0,0,0.5);

bottom:0px;

left:0px;

}

 

#product_list li .left_block .compare label {

display:none;

}

 

#product_list li p.compare input {

vertical-align:text-bottom

}

 

#product_list li .center_block {

text-align:center;

}

 

#product_list li .center_block .product_desc {

display:none;

clear:both;

}

 

#product_list li .center_block h3 {

font-size:16px;

padding-top:10px;

margin-top:10px;

display:block;

width:100%;

height: 27px;

clear:both;

text-align:center;

}

 

#product_list a.product_img_link {

overflow:hidden;

position:relative;

display:block;

/*border:1px solid #ccc;*/

text-align:center;

margin:auto;

}

 

#product_list a.product_img_link img {

vertical-align:bottom;

}

 

#product_list li span.new {

display:none;

position:absolute;

top:15px;

right:-30px;

padding:1px 4px;

width:101px;

font-size:10px;

color:#fff;

text-align:center;

text-transform:uppercase;

-moz-transform:rotate(45deg);

-webkit-transform:rotate(45deg);

-o-transform:rotate(45deg);

background-color:#990000;

transform:rotate(45deg);

-ms-transform:rotate(45deg); /* Newer browsers */

}

 

.ie8 #product_list li span.new {

top:111px;

right:0;

width:94%

}

 

.ie7 #product_list li span.new {

top:111px;

right:0;

width:94%

}

 

#product_list li h3 {

padding:0 0 10px 0;

font-size:13px;

color:#000

}

 

#product_list li a {

color:#444444;

font-weight: bold;

text-decoration:none;

}

 

#product_list li p.product_desc {

overflow:hidden;

padding:0;

line-height:16px;

}

 

#product_list li p.product_desc,#product_list li p.product_desc a {

color:#666;

}

 

#product_list li .right_block {

display:block;

clear:both;

}

 

#product_list li .discount,ul#product_list li .online_only {

display:block;

font-weight:bold;

color:#990000;

text-transform:uppercase

}

 

#product_list li .discount,ul#product_list li .on_sale {

position:absolute;

bottom:0;

right:0;

display:inline-block;

font-weight:bold;

padding:1px 5px;

font-size:10px;

color:#fff;

text-transform:uppercase;

background:none repeat scroll 0 0 #9B0000

}

 

#product_list li .online_only {

margin:0 0 10px 0

}

 

#product_list li .content_price {

position:relative;

}

 

#product_list li .price {

display:block;

margin-bottom:15px;

font-weight:bold;

font-size:700;

color:#ff7900

}

 

#product_list li span.availability {

color:#488C40

}

 

#product_list li .ajax_add_to_cart_button {

padding-left:7px;

color: #ffffff;

}

 

#product_list li .ajax_add_to_cart_button span {

display:none;

position:absolute;

top:-1px;

left:-12px;

height:26px;

width:26px;

background:url(../img/icon/pict_add_cart.png) no-repeat 0 0 transparent

}

 

#product_list .lnk_more {

font-weight:normal;

}

 

#product_list li .lnk_view {

display:block;

margin-top:15px;

padding:0 10px;

border:none;

font-weight:bold;

color:#0088CC;

background:url(../img/arrow_right_1.png) no-repeat 100% 4px transparent

}

 

#product_list li .lnk_view:hover {

text-decoration:underline

}

 

 

=========================================================================

TPL

 


{literal}

    <script>

        $(document).ready(function(){

            $(".dropshadowclass").mouseover(function (){

              $(this).find(".poverlay").css('visibility','visible');

            });

            $(".dropshadowclass").mouseout(function (){

              $(this).find(".poverlay").css('visibility','hidden');

            });

        });

    </script>

{/literal}

             

{if isset($products)}

    <!-- Products list -->

    <ul id="product_list" class="clear">

    {foreach from=$products item=product name=products}

        <li class="dropshadowclass ajax_block_product {if $smarty.foreach.products.first}first_item{elseif $smarty.foreach.products.last}last_item{/if} {if $smarty.foreach.products.index % 2}alternate_item{else}item{/if} clearfix">

            <div class="center_block">

                <a href="{$product.link|escape:'htmlall':'UTF-8'}" class="product_img_link" title="{$product.name|escape:'htmlall':'UTF-8'}">

                    <img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home_default')|escape:'html'}" alt="{$product.legend|escape:'htmlall':'UTF-8'}" {if isset($homeSize)} width="{$homeSize.width}" height="{$homeSize.height}"{/if} />

                        {if isset($product.new) && $product.new == 1}<span class="new">{l s='New'}</span>{/if}

                        {if isset($product.on_sale) && $product.on_sale && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}<span class="on_sale">{l s='On sale!'}</span>

                        {elseif isset($product.reduction) && $product.reduction && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}<span class="discount">{l s='Reduced price!'}</span>{/if}

                        {if (!$PS_CATALOG_MODE AND ((isset($product.show_price) && $product.show_price) || (isset($product.available_for_order) && $product.available_for_order)))}

                        {if isset($product.online_only) && $product.online_only}<span class="online_only">{l s='Online only'}</span>{/if}

                        {/if}

                </a>

                    <h3>{if isset($product.pack_quantity) && $product.pack_quantity}{$product.pack_quantity|intval|cat:' x '}{/if}<a href="{$product.link|escape:'htmlall':'UTF-8'}" title="{$product.name|escape:'htmlall':'UTF-8'}">{$product.name|truncate:35:'...'|escape:'htmlall':'UTF-8'}</a></h3>

                    <p class="product_desc"><a href="{$product.link|escape:'htmlall':'UTF-8'}" title="{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}" >{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}</a></p>

                    <div class="content_price"><a class="lnk_more" href="{$product.link|escape:'html'}" title="{l s='Shop now' mod='homefeatured'}">{l s='Shop now' mod='homefeatured'}</a>

                        {if isset($product.show_price) && $product.show_price && !isset($restricted_country_mode)}<span class="price" style="display: inline;">{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}</span><br />{/if}<a class="cartbutton button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add=1&id_product={$product.id_product|intval}&token={$static_token}", false)|escape:'html'}" title="{l s='Add to Basket'}"><span></span>{l s='Add to Basket'}</a>

                        {*{if isset($product.available_for_order) && $product.available_for_order && !isset($restricted_country_mode)}<span class="availability">{if ($product.allow_oosp || $product.quantity > 0)}{l s='Available'}{elseif (isset($product.quantity_all_versions) && $product.quantity_all_versions > 0)}{l s='Product available with different options'}{else}{l s='Out of stock'}{/if}</span>{/if}*}

                    </div>

                     

            </div>

            <div class="poverlay">

                <div class="right_block">

                        {if isset($comparator_max_item) && $comparator_max_item}

                            <p class="compare">

                                <input type="checkbox" class="comparator" id="comparator_item_{$product.id_product}" value="comparator_item_{$product.id_product}" {if isset($compareProducts) && in_array($product.id_product, $compareProducts)}checked="checked"{/if} autocomplete="off"/> 

                                <label for="comparator_item_{$product.id_product}">{l s='Select to compare'}</label>

                            </p>

                        {/if}           

                    {if ($product.id_product_attribute == 0 || (isset($add_prod_display) && ($add_prod_display == 1))) && $product.available_for_order && !isset($restricted_country_mode) && $product.minimal_quantity <= 1 && $product.customizable != 2 && !$PS_CATALOG_MODE}

                        {if ($product.allow_oosp || $product.quantity > 0)}

                            {if isset($static_token)}

                                <a class="cartbutton button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add=1&id_product={$product.id_product|intval}&token={$static_token}", false)|escape:'html'}" title="{l s='Add to cart'}"><span></span>{l s='Add to cart'}</a>

                            {else}

                                <a class="cartbutton button ajax_add_to_cart_button exclusive" rel="ajax_id_product_{$product.id_product|intval}" href="{$link->getPageLink('cart',false, NULL, "add=1&id_product={$product.id_product|intval}", false)|escape:'html'}" title="{l s='Add to cart'}"><span></span>{l s='Add to cart'}</a>

                            {/if}                       

                        {else}

                            <span class="cartbutton exclusive"><span></span>{l s='Add to cart'}</span>

                        {/if}

                    {/if}

                    <div class="viewbutton">

                    <a class="button" href="{$product.link|escape:'htmlall':'UTF-8'}" title="{l s='View'}">{l s='View'}</a>

                    </div>

                </div>

            </div>

        </li>

    {/foreach}

    </ul>

    <!-- /Products list -->

{/if}

Link to comment
Share on other sites
  • 2 weeks later...
  • 4 weeks later...
razaro Proficient

razaro

Posted
Posted

Try this, not tested and probably some styling is needed.

 

Open new-products.tpl and remove 

{include file="./product-sort.tpl"}

then in pagination.tpl add

<li class="productsbypage">{include file="./product-sort.tpl"}</li>

just after Previous button code so looks similar to this

		<ul class="pagination">
		{if $p != 1}
			{assign var='p_previous' value=$p-1}
			<li id="pagination_previous{if isset($paginationId)}_{$paginationId}{/if}" class="pagination_previous"><a {$no_follow_text} href="{$link->goPage($requestPage, $p_previous)}">« {l s='Previous'}</a></li>
		{else}
			<li id="pagination_previous{if isset($paginationId)}_{$paginationId}{/if}" class="disabled pagination_previous"><span>« {l s='Previous'}</span></li>
		{/if}
		<li class="productsbypage">{include file="./product-sort.tpl"}</li>
		{if $start==3}
			<li><a {$no_follow_text}  href="{$link->goPage($requestPage, 1)}">1</a></li>
			<li><a {$no_follow_text}  href="{$link->goPage($requestPage, 2)}">2</a></li>
		{/if}

then add styles to that new list element using class .productsbypage {....}.

 

You can first just add display:none and then test styles in browser dev tools.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...