How to modify sendtoafriend module CSS?

[mtm]

I was able to change and modify all the CSS (and tpl) files so far except for the sendtoafriend module (and also the send to my friend module, wich is a free adaptation).

 

To give you a simple example:

If i want to change/modify the CSS of the h1 title only in the My Account page, i just type: #my-account h1 { whatever }. This worked for every page until now.

 

When i tried to do the same for the Send to Friend page, nothing worked. I tried #sendtoafriend h1; #sendtoafriend-form h1; #sendtoafriend.sendtoafriend-form h1 and more...

Only worked with h1 { whatever } but then it would change every h1 in the store; not just the h1 in the sendtoafriend page.

I was wobndering if i must do those changes on a tpl file instead...

 

I use Firebug or the built-in Chrome tool to help me visualise the changes in CSS in real time.

I have PS 1.4.8.2.

 

Can anyone help me on this?

Thanks.

Edited July 31, 2013 by mtm (see edit history)

[vekia]

is there any chance to see your website live? you use default theme (many things depend on template that you use)

[mtm]

Hi vekia,

 

The site is not public and it's in a protected directory.

Regarding the template, it's a custom one but i don't know if it's based on the default one.

 

I saw a topic here somewhere on how to change the title text color on the sendtofriend module but the CSS solution was for PS 1.5.

There are no "send to ftiend" on my product.css file as it's mentioned on that topic.

[mtm]

No one knows how to modify/edit the Send to Friend CSS module?

[Antho_Girard]

Hi,

 

Wich CSS file do you modify? You said that you use tools like Firebug, when you inspect the h1 element you can see wich CSS files are used. Maybe the file you modified is not used/loaded.

 

You can also try to modify the style of another element of the module to find out where the problem could be.

 

Antho

[mtm]

Hi Antho,

 

Thanks for the reply. Sorry for the delay... I was away for 3 days.

 

The CSS file when i inspect the page ../modules/sendtoafriend/sendtoafriend-form.php is global.css. But as i described, if i want to change h1 element, i can but it would change all h1 globally. If i try to do what i've done with other specific pages/areas, it doesn't work - like say; changing the h1 in the my account page (my-account.php), all i have to do is #my-account h1 { whatever }.

However, this doesn't work on this page...

[Antho_Girard]

I just checked on a PS 1.4 website and I saw that the id is not #sendtoafriend but #sendfriendpage and the CSS file was /module/sendtoafriend/sendtoafriend.css

 

I'm not sure if the module has been modified but you can check if there is a sendtoafriend.css file somewhere, and can you tell us what's the code in the tpl file (the div and h1 part) ?

 

Antho

[mtm]

Hi Antho,

 

I have no sendtoafriend.css file; just the global.css is afecting the page.

Also, i've tried using #sendfriendpage h1 { whatever } but that didn't worked either.

 

I have 2 tpl files in the /module/sendtoafriend directory: sendtoafriend.tpl and product_page.tpl.

 

The code in the tpl file (the div and h1 part) is in the sendtoafriend.tpl file:

 

<h1>{l s='Send to a friend' mod='sendtoafriend'}</h1>

 

Here's the full sendtoafriend.tpl code:

 

{capture name=path}{l s='Send to a friend' mod='sendtoafriend'}{/capture}
{include file="$tpl_dir./breadcrumb.tpl"}

<h1>{l s='Send to a friend' mod='sendtoafriend'}</h1>

<p style="margin: 10px 0px; padding:0; color:#CA9900; font-size: 13px;">{l s='Send this page to a friend who might be interested in the item below.' mod='sendtoafriend'}.</p>
{include file="$tpl_dir./errors.tpl"}

{if isset($smarty.get.submited)}
<p class="success">{l s='Your email has been sent successfully' mod='sendtoafriend'}</p>
{else}
<form method="post" action="{$request_uri}" class="std">
<fieldset>

<p class="align_center">
<a href="{$productLink}"><img src="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'home')}" alt="" title="{$cover.legend|escape:'htmlall':'UTF-8'}" /></a><br/>
<a href="{$productLink}">{$product->name|escape:'htmlall':'UTF-8'}</a>
</p>

<p>
<label for="friend-name">{l s='Friend\'s name:' mod='sendtoafriend'}</label>
<input type="text" size="40" id="friend-name" name="name" value="{if isset($smarty.post.name)}{$smarty.post.name|escape:'htmlall':'UTF-8'|stripslashes}{/if}" />
</p>
<p>
<label for="friend-address">{l s='Friend\'s email:' mod='sendtoafriend'}</label>
<!--<input type="text" size="40" id="friend-address" name="email" value="{if isset($smarty.post.name)}{$smarty.post.email|escape:'htmlall'|stripslashes}{/if}" />-->
			<textarea cols="46" rows="3" class="input-form" id="friend-address" name="address_email" ></textarea>
</p>

<p class="submit">
<input type="submit" style="margin-left:3px;" name="submitAddtoafriend" value="{l s='send' mod='sendtoafriend'}" class="button" />
</p>

</fieldset>
</form>
{/if}

<ul class="footer_links">
<li><a href="{$productLink}" class="button_large">{l s='Back to product page' mod='sendtoafriend'}</a></li>
</ul>

 

The code from the product_page.tpl is:

 

<li><a class="sendfriend" href="{$this_path}sendtoafriend-form.php?id_product={$smarty.get.id_product|intval}">{l s='Send to a friend' mod='sendtoafriend'}</a><span>{l s='Share your shopping bag'}</span></li>

 

Thanks for the help.