Soucis de block

[loick]

Bonjour,

 

je suis responsable de la nouvelle mise en page du site web d'un client qui souhaite passer sur la version 1.5.

 

Seulement je n'arrive pas a trouver comment modifier le block des produits phares sans modifier tout les éléments de la homepage....

J'aimerais que le block du titre prenne toute la largeur de la partie "produit phare"

 

Pourriez-vous m'éguiller?

 

voici les css que j'ai actuellement:

 

global.css:

 

/* BLOCK .block ******************************************************************************** */
.block {margin-bottom:20px}
#footer .block {margin-bottom:1px
}
    .block .title_block, .block h4 {
        padding:6px 11px;
        font-size:12px;
        /*couleur des titres block categorie et deja vue*/
        color:#000;
        /*text-shadow:0 1px 0 #000;*/
        text-transform:uppercase;
        /*background:#383838;*/
        background: transparent url('../img/block_header.png') no-repeat center top;
        /*font-weight: bold*/
    }
        .block .title_block a, .block h4 a {color:#fff}
    .block ul {list-style-type:none}
        .block li.last {    border:none}
            .block li a {
                display:block;
                color:#333

 

homefeatured.tpl:

 

 

<!-- MODULE Home Featured Products -->
<div id="featured-products_block_center" class="block products_block clearfix">
    <p class="title_block">{l s='Featured products' mod='homefeatured'}</p>
    {if isset($products) AND $products}
        <div class="block_content">
            {assign var='liHeight' value=250}
            {assign var='nbItemsPerLine' value=4}
            {assign var='nbLi' value=$products|@count}
            {math equation="nbLi/nbItemsPerLine" nbLi=$nbLi nbItemsPerLine=$nbItemsPerLine assign=nbLines}
            {math equation="nbLines*liHeight" nbLines=$nbLines|ceil liHeight=$liHeight assign=ulHeight}
            <ul style="height:{$ulHeight}px;">
            {foreach from=$products item=product name=homeFeaturedProducts}
                {math equation="(total%perLine)" total=$smarty.foreach.homeFeaturedProducts.total perLine=$nbItemsPerLine assign=totModulo}
                {if $totModulo == 0}{assign var='totModulo' value=$nbItemsPerLine}{/if}
                <li class="ajax_block_product {if $smarty.foreach.homeFeaturedProducts.first}first_item{elseif $smarty.foreach.homeFeaturedProducts.last}last_item{else}item{/if} {if $smarty.foreach.homeFeaturedProducts.iteration%$nbItemsPerLine == 0}last_item_of_line{elseif $smarty.foreach.homeFeaturedProducts.iteration%$nbItemsPerLine == 1} {/if} {if $smarty.foreach.homeFeaturedProducts.iteration > ($smarty.foreach.homeFeaturedProducts.total - $totModulo)}last_line{/if}">
                    <a href="{$product.link|escape:'html'}" title="{$product.name|escape:html:'UTF-8'}" class="product_image"><img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home_default')|escape:'html'}" height="{$homeSize.height}" width="{$homeSize.width}" alt="{$product.name|escape:html:'UTF-8'}" />{if isset($product.new) && $product.new == 1}<span class="new">{l s='New' mod='homefeatured'}</span>{/if}</a>
                    <p class="s_title_block"><a href="{$product.link|escape:'html'}" title="{$product.name|truncate:50:'...'|escape:'htmlall':'UTF-8'}">{$product.name|truncate:35:'...'|escape:'htmlall':'UTF-8'}</a></p>
                    <div class="product_desc"><a href="{$product.link|escape:'html'}" title="{l s='More' mod='homefeatured'}">{$product.description_short|strip_tags|truncate:65:'...'}</a></div>
                    <div>
                        <a class="lnk_more" href="{$product.link|escape:'html'}" title="{l s='View' mod='homefeatured'}">{l s='View' mod='homefeatured'}</a>
                        {if $product.show_price AND !isset($restricted_country_mode) AND !$PS_CATALOG_MODE}<p class="price_container"><span class="price">{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}</span></p>{else}<div style="height:21px;"></div>{/if}
                        
                        {if ($product.id_product_attribute == 0 OR (isset($add_prod_display) AND ($add_prod_display == 1))) AND $product.available_for_order AND !isset($restricted_country_mode) AND $product.minimal_quantity == 1 AND $product.customizable != 2 AND !$PS_CATALOG_MODE}
                            {if ($product.quantity > 0 OR $product.allow_oosp)}
                            <a class="exclusive ajax_add_to_cart_button" rel="ajax_id_product_{$product.id_product}" href="{$link->getPageLink('cart')|escape:'html'}?qty=1&id_product={$product.id_product}&token={$static_token}&add" title="{l s='Add to cart' mod='homefeatured'}">{l s='Add to cart' mod='homefeatured'}</a>
                            {else}
                            <span class="exclusive">{l s='Add to cart' mod='homefeatured'}</span>
                            {/if}
                        {else}
                            <div style="height:23px;"></div>
                        {/if}
                    </div>
                </li>
            {/foreach}
            </ul>
        </div>
    {else}
        <p>{l s='No featured products' mod='homefeatured'}</p>
    {/if}
</div>
<!-- /MODULE Home Featured Products -->

 

Merci d'avance.

[Atch]

bonjour,

 

Par défaut, ça n'est pas déjà le cas ? le titre ne fait pas 100% la largeur du module ?

 

Sinon vous pouvez toujours faire un truc du genre :

 

#featured-products_block_center .title_block { votre css }

 

Pour isoler le titre des produits phares...

 

V++

 

Atch

[loick]

oui j'ai cette ligne, mais le soucis c'est que le background du titre le prend pas tout la largeur...

C'est la mon soucis... désolé de m'être mal exprimé.

 

J'aimerai aussi mettre un degradé en fond sur mes produits pahres mais sans succès, si vous pouviez aussi m'aider sur ce point, je vous en serais grès!

 

Merci d'avance!!!

[Szed]

Votre background est une image en no-repeat. Si elle n'est pas assez longue, normal qu'elle ne prenne pas toute la largeur.

Vous devez :

• Soit modifié l'image pour qu'elle soit assez longue
• Soit utilisé une image en repeat.

Pour les dégradé des blocs, cela peut se faire en CSS. Il existe des générateurs de dégradé en CSS (par exemple : http://www.colorzilla.com/gradient-editor/)

[loick]

Merci pour ta reponse szed!

 

Seulement j'aimerais rentrer des codes couleurs particuliers... en top: #3366CC et en bottom: #FFFFFF

 

Si vous pouvez m'éclairer... je vous en remercie d'avance!

[loick]

merci pour vos réponses, ma solution fût de créer moi même mon gradient avec gimp et de l'integrer!

 

Bonne continuation à tous!