Help with Sidebox

[LissaE]

I have javascript in a blank sidebox working no problems, the issue is that there are single quotes (') in the script posted in the OP that haven't been escaped with a backslash, you need to change this:

<a class="tf_upfront_badge" href="http://www.thefind.com/whats-upfront" title="TheFind Upfront"><img border="0" src="//upfront.thefind.com/images/badges/templates/s_badge.png" alt="Thrift 4 Kids! is upfront"/></a>
<script src="//upfront.thefind.com/scripts/main/utils-init-ajaxlib/upfront-badgeinit.js" type="text/javascript"></script>
<script type="text/javascript">thefind.upfront.init('tf_upfront_badge', 'cddb7c312d9495a11e4a546fc1cd043e')</script>

to this:

<a class="tf_upfront_badge" href="http://www.thefind.com/whats-upfront" title="TheFind Upfront"><img border="0" src="//upfront.thefind.com/images/badges/templates/s_badge.png" alt="Thrift 4 Kids! is upfront"/></a>
<script src="//upfront.thefind.com/scripts/main/utils-init-ajaxlib/upfront-badgeinit.js" type="text/javascript"></script>
<script type="text/javascript">thefind.upfront.init(\'tf_upfront_badge\', \'cddb7c312d9495a11e4a546fc1cd043e\')</script>

I believe it then should work....good luck

[mw4kids]

that's awesome...I'll give it a shot this week and report back if it works. thanks!!!

[gjh42]

A note that may help in this sort of situation: If you use a good file editor like Notepad++ (free from Sourceforge), it will show you problematic quote characters like these by throwing off the usual element type highlight colors after an unescaped quote.

Also, if you post PHP code in the forum using [php] and [/php] tags, the quotes' effect will show up.

define('BOX_HEADING_BLANK_SIDEBOX', 'Thrift 4 Kids is Upfront');
define('TEXT_BLANK_SIDEBOX', '<a class="tf_upfront_badge" href="http://www.thefind.com/whats-upfront" title="TheFind Upfront"><img  border="0" src="//upfront.thefind.com/images/badges/templates/s_badge.png" alt="Thrift 4 Kids! is upfront"/></a>
<script src="//upfront.thefind.com/scripts/main/utils-init-ajaxlib/upfront-badgeinit.js" type="text/javascript"></script>
<script type="text/javascript">thefind.upfront.init('tf_upfront_badge', 'cddb7c312d9495a11e4a546fc1cd043e')</script>
'); 

[xt0rt]

LissaE,

I will give this a shot today and let you all know if I was successful. I assumed that I could use an escape character but was unsure and didn't feel like breaking the site unnecessarily.

gjh42,

Notepad++ is good software. I used to use this back in the day, but I went so long without using Windows that I forgot about some of the good freeware that is available. Downloaded & installed!

[xt0rt]

LissaE,

I followed your instructions and now site is rendering just fine with the TheFind Upfront graphic. Thanks for all your help!

mw4kids,

Just follow the instructions above, and you'll be set.

[mw4kids]

well it almost works

The code doesn't break my site, but the badge comes out of the box. Also I have directional text under it that I'm not sure how to get rid of.

take a look here:

www.thrift4kids.com

Any ideas?

Thanks LissaE for your help with this code by the way!!

Update: Just notice that this only occurs on my home page... other pages it's perfect (other than the text under it:-)

[mw4kids]

ok...got the text out by deleting it in the

includes>templates>template default>sideboxes>tpl_blank_sidebox.php file

Now working to see how I can get the badge IN the sidebox

[gjh42]

Firebug says about the sidebox badge:
(line 182)
Inherited from p

p {
text-indent:70px;
}

It looks like you have a generic p{} rule with 70px indent. That is obviously not going to work in most locations. You need to specify which locations of p get this indent.

For starters, change the 70 to 7 and see what happens.

The rest of the sidebox content is most likely left over from when you installed the new files, and didn't delete unnecessary boilerplate.

I see you have now done that.

[mw4kids]

that did it...yeah thanks!

I used that coding b/c I was trying to center my Affiliate banner. Without it it shifts to the left...which is ok...just thought it looked better centered on the page.

thanks again everyone for all your help!!

[gjh42]

By "affiliate banner, do you mean this paragraph you have added to the bottom of your page?
We're listed on ShopMania - Online Shopping

It looks like you created the define page in MS Office, which has put a lot of junk HTML tags in but not given you any good handles to use for styling the content in your stylesheet.

<p class="MsoNoSpacing" style="font-family: Verdana;"><big>We're listed
on <a onclick="function onclick(event) {
window.open(" http:=""
www.shopmania.com="" ?m="3243");" return="" false;="" }=""
href="http://www.shopmania.com/">ShopMania</a>
- <a onclick="function onclick(event) {
window.open(" http:=""
www.shopmania.com="" ?m="3243");" return="" false;="" }=""
href="http://www.shopmania.com/">Online
Shopping</a> <o:p></o:p></big></p>

Add a meaningful class to the first <p> like
<p class="MsoNoSpacing affiliateBanner" style="font-family: Verdana;">
The red parts are probably not doing anything for you, and could be eliminated.

Then just use a stylesheet rule targeted to that banner:

p.affiliateBanner {
text-indent:70px;
}

I also see the editor has used a bunch of javascript to open the links in a new window, when that can be done very easily in plain HTML. Replace both

<a onclick="function onclick(event) {
window.open(" http:=""
www.shopmania.com="" ?m="3243");" return="" false;="" }=""
href="http://www.shopmania.com/">

with

<a href="http://www.shopmania.com/" target="_blank">

Cleaner code:

<p class="affiliateBanner">We're listed
on <a  href="http://www.shopmania.com/" target="_blank">ShopMania</a>
- <a  href="http://www.shopmania.com/" target="_blank">Online
Shopping</a></p>

Any further styling you want to do can be put in the .affiliateBanner rule in the stylesheet.