TinyPortal

Development => Support => Topic started by: antechinus on February 06, 2008, 11:50:42 AM

Title: Code for linking 150x35 icons to other sites in TP side panel?
Post by: antechinus on February 06, 2008, 11:50:42 AM
Ok, I can do this sort of thing in BBC but being still a bit of a mug I can't do it in html or php.
I want to set up a stack of nifty icons that link to related sites (like the ones you have here) and put it in the TP side panel.
Can some angel of mercy help a poor guy out and post up the code I need? Thanks.

PS. Yes, I did try searching first.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: Zetan on February 06, 2008, 12:04:49 PM
Sure

To simply link an image in HTML:



<a href="http://www.linkhere.com/"><img src="http://imagesourceurlhere.gif" border="0" title="mouse over title here."></a>



To open in a new tab/window add the following inline:

target="_blank"




<a href="http://www.linkhere.com/" target="_blank"><img src="http://imagesourceurlhere.gif" border="0" title="mouse over title here."></a>



Check the block code snippets board, there are a few different menus in there that you could use.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: antechinus on February 06, 2008, 12:59:59 PM
Nope, I can't get that to work, and I've tried going straight off the images folder in publc_html. I've got the image path right, I know the url of the target site, but all I'm getting in the side panel is the text I typed into the article.
Just in case I made another images folder under my test forum's directory and used that path. No luck there either.

Let me put this another way: what is the exact code string used for hooking up that SMF link icon in the side panel here?
I can probably understand that if I can see it. I looked through the block snippet board but there wasn't anything that seemed to relate directly to this. I don't know enough about html to modify something sort of similar unless it's screamingly obvious.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: Zetan on February 06, 2008, 01:06:06 PM
Try a Script type block, not a BBC block.

For php, use an echo ' statement, which ends ';



echo ' <a href="http://www.linkhere.com/"><img src="http://imagesourceurlhere.gif" border="0" title="mouse over title here."></a>';

Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: G6Cad on February 06, 2008, 01:06:37 PM
You cant get a more exact code string then the one ZTN posted.
Make sure your image path is writable and that you use a HTML Block
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: antechinus on February 06, 2008, 01:18:26 PM
I thought the TP article blocks were html by default. There's a box for changing them to php but I haven't checked that. I already know BBC doesn't work in them because I tried it just for the hell of it.

When you say "make sure the image path is writable", I'm using the  directory tree straight out of my FTP software, so it should be accurate.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: Zetan on February 06, 2008, 01:19:35 PM
Did you try what I suggested?
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: antechinus on February 06, 2008, 01:34:50 PM
The echo statement? Yep, tried that. It displayed text only, presumably because the article is html.
Then I checked the "change to php" box and got an error message.

Parse error: syntax error, unexpected '&' in /home/cofexm/public_html/weaponstestingrange/Sources/Load.php(1735) : eval()'d code(101) : eval()'d code on line 1

I'm missing something really basic here. The path I'm trying to use is http://www.mysite.com/public_html/weaponstestingrange/images/linky.gif

Weaponstestingrange is the name of my test forum directory.

ETA: I changed the article back to html and now the image is showing up between the  echo '   and ' ; tags. It still doesn't link to anywhere though and now I can't see the code when I try to edit the article. The image is there even in edit mode.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: Zetan on February 06, 2008, 01:40:23 PM
You are missing something simple. This is very basic stuff to be honest.
Article, Block?

Script type block.
php type block/Article?

Try an image from another site just as a test, I don't condone hotlinking.
You HAVE to use the correct type of block for the type of code/script you wish to use.

Use php in a php type block.
html is best used in a script block
BBCode in a BBC type block..

Best add a smiley.. sounds like I'm ranting now  :buck2:
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: keith021773 on February 06, 2008, 01:42:18 PM
Don't put them in an article page..    Try using the above code in a side block HTML block..   

You beat me to it ZTN.   :)
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: Zetan on February 06, 2008, 01:47:08 PM
If you are using an Article, turn the WYSIWYG editor off, or the FCK Editor, whichever you use.
Then enter the code and save. Don't try inserting code with an editor.

Quote from: keith021773 on February 06, 2008, 01:42:18 PM
You beat me to it ZTN.   :)

lol, sorry keith  :P
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: antechinus on February 06, 2008, 02:12:43 PM
 :up: That's what it was: the editor. The settings were still on the default value because I didn't know what the damned thing did so I figured I should leave it alone. It'd made a pig's breakfast of the code. I turned the editor off, cleaned up the mess, entered your original code and hey presto, it works!
That was the basic bit I was missing.  :)
Tanku, tanku, tanku. I can do the rest of the links easily now.
Marked as solved.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: Zetan on February 06, 2008, 02:32:38 PM
lol..  :coolsmiley:

Quote from: antechinus on February 06, 2008, 11:50:42 AM
(like the ones you have here) and put it in the TP side panel.

After establishing Article and not Block.
Title: Some link icons won't display: html, files and image paths already checked.
Post by: antechinus on February 07, 2008, 09:34:55 AM
Yes, I'm back.  ;)
So I've managed to get my nifty 150x35 link icons displaying in my side panel using html......but....only some of them display. The others don't, but something is pushing the size of the box out as if there's something there.

Here's where I'm at:

1/ I've checked the image paths and target site url's thoroughly.

2/ I've deleted and reinstalled the image files via ftp.

3/ I've then downloaded the image files back to my computer (in a different folder to the originals) and they display perfectly. Ergo I assume they aren't corrupted.

4/ I then c&p'd the html from the article directly into Notepad and saved that on my desktop as a test file. When I call it up on my browser it displays perfectly, with all icons visible and spaced correctly. All the link icons function flawlessly. So the html, image paths and target url's are correct.

5/ After doing all this some of the icons still aren't displaying on my test forum. The ones that are displaying work just fine.
I closed Firefox, disconected teh Net and restarted my poota just to make sure. No difference.

I'm not stressing about this but it's got me thoroughly stumped. Anyone see something I've missed?

ETA:

Link to my site: Available to staff via pm.
SMF version: SMF 1.1.4
TP version: TP ver. 0.983
Theme name and version: Devil's Rejects.
Mods installed: None.
Related Error messages: None.
Title: Re: Some link icons won't display: html, files and image paths already checked.
Post by: Zetan on February 07, 2008, 10:00:53 AM
Post your code.
Title: Re: Some link icons won't display: html, files and image paths already checked.
Post by: G6Cad on February 07, 2008, 10:03:17 AM
Also make sure the actuall image names are corrct like
JPG or jpg, GIF, gif, PNG png, etc etc  Make sure the uppwer and lower cases are correct. they MUSt be the same as in the code your using
Title: Re: Some link icons won't display: html, files and image paths already checked.
Post by: antechinus on February 07, 2008, 10:07:31 AM
Quote from: G6 on February 07, 2008, 10:03:17 AM
Also make sure the actuall image names are corrct like
JPG or jpg, GIF, gif, PNG png, etc etc  Make sure the uppwer and lower cases are correct. they MUSt be the same as in the code your using

Already sorted. I've been thorough this time. As in:

Quote4/ I then c&p'd the html from the article directly into Notepad and saved that on my desktop as a test file. When I call it up on my browser it displays perfectly, with all icons visible and spaced correctly. All the link icons function flawlessly. So the html, image paths and target url's are correct.
Title: Re: Some link icons won't display: html, files and image paths already checked.
Post by: antechinus on February 07, 2008, 10:10:46 AM
Quote from: ZTN on February 07, 2008, 10:00:53 AM
Post your code.

Sure. Here it is:

<p align ="center"><a href="http://www.nontheistnexus.com/" target="_blank"><img src="http:/ourtestsite.com/images/nexusButton_150x34.gif" border="0" ></a></p>

That's one of the one's that isn't showing. Apart from the target url and the image name the format is identical to the ones that are showing.
Title: Re: Some link icons won't display: html, files and image paths already checked.
Post by: antechinus on February 07, 2008, 10:30:44 AM
Might as well ask a really basic question: is there a limit to the number of icons TP 0.983 will display?
Four are currently showing and I was aiming for ten.
Title: Re: Some link icons won't display: html, files and image paths already checked.
Post by: Zetan on February 07, 2008, 10:34:05 AM
Can you post the whole code for each image, direct from the page including the formatting, line breaks etc..
No limits, only server limits and user bandwidth.
Title: Re: Some link icons won't display: html, files and image paths already checked.
Post by: antechinus on February 07, 2008, 10:39:59 AM
Quote from: ZTN on February 07, 2008, 10:34:05 AM
Can you post the whole code for each image, direct from the page including the formatting, line breaks etc..
No limits, only server limits and user bandwidth.

Ok, if you want the whole lot here it is. Of course you wont be able to check the image paths without access to my server but I can screenshot my ftp display if you think it will help. Anyway here's the entire article code by c/p:

<p align ="center"><a href="http://our_mob.com/" target="_blank"><img src="http://our_mob.com/images/stinkylinky.gif"  border="0" ></a></p>
<p align ="center"><a href="http://them.org.uk/" target="_blank"><img src="http://our_mob.com/images/notherlinky.gif"  border="0" ></a></p>
<p align ="center"><a href="http://www.whodat.de/" target="_blank"><img src="http://our_mob.com/images/theirlinky.gif" border="0" ></a></p>
<p align ="center"><a href="http://www.sometossers.com/" target="_blank"><img src="http://our_mob.com/images/tosserslink.gif" border="0" ></a></p>
<p align ="center"><a href="http://www.moreloonies.org/" target="_blank"><img src="http:/our_mob.com/images/looniesButton_150x34.gif" border="0" ></a></p>
<p align ="center"><a href="http://www.hippopotamus.com/" target="_blank"><img src="http:/our_mob.com/images/hippoButton_150x34.gif" border="0" ></a></p>
<p align ="center"><a href="http://www.mutants.com/" target="_blank"><img src="http:/our_mob.com/images/mutantslink.gif" border="0" ></a></p>
<p align ="center"><a href="http://montypythonsflyingcircus.net/" target="_blank"><img src="http:/our_mob.com/images/mpfc.gif" border="0" ></a></p>
<p align ="center"><a href="http://www.meh.org/" target="_blank"><img src="http:/our_mob.com/images/mehlinky.gif" border="0" ></a></p>
<p align ="center"><a href="http://www.aardvarks.org/" target="_blank"><img src="http:/our_mob.com/images/aardvarkslinky.gif" border="0" ></a></p>


I'm running two copies of this, done by c&p. One in an html+BBC box and one in an html article (with WYSIWYG editer turned off!). Same thing happens in both.

ETA: It'll take me a few minutes to hook it up but I'll do the ftp screenshot just so you can check the image paths.
Title: Re: Some link icons won't display: html, files and image paths already checked.
Post by: G6Cad on February 07, 2008, 10:50:19 AM
Would be good if you can show us the code from the images that DONT show up.

Also another note, if you have the images stored locally, you dont need to add the whole url for them, just /images/imagename here.
Title: Re: Some link icons won't display: html, files and image paths already checked.
Post by: Zetan on February 07, 2008, 10:52:43 AM
I’m unsure why you are using alignment on every image, and why P align? P align is for Paragraphs.

Try

<div align="center">
Image code here
<br />
Image code here
<br />
Etc
</div>


I’m not sure why some images aren’t displaying yet..

I’m also merging this with your other topic as it is about the same thing.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: antechinus on February 07, 2008, 10:57:02 AM
Quote from: G6 on February 07, 2008, 10:50:19 AM
Would be good if you can show us the code from the images that DONT show up.

It's all there. The first four are the ones that show up.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: antechinus on February 07, 2008, 11:01:19 AM
Quote from: ZTN on February 07, 2008, 10:52:43 AM
I'm unsure why you are using alignment on every image, and why P align? P align is for Paragraphs.
That's because I didn't know better.

QuoteTry

<div align="center">
Image code here
<br />
Image code here
<br />
Etc
</div>
Thanks. I will.

QuoteI'm not sure why some images aren't displaying yet..

I'm also merging this with your other topic as it is about the same thing.

Cool. I just started another thread as the guidelines say not to post in "solved" ones. If you want admin access to have a look for yourself let me know.

Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: Zetan on February 07, 2008, 11:04:20 AM
Prematurely solved  ;) I can't do much as I'm at work. PM me the URL
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: antechinus on February 07, 2008, 11:12:10 AM
Quote from: ZTN on February 07, 2008, 11:04:20 AM
Prematurely solved  ;) I can't do much as I'm at work. PM me the URL
You want admin access or just the site linky?

ETA: Scratch that. It's only a test site. I'll hook you up with admin. PM will be on it's way in a few minutes.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: Zetan on February 07, 2008, 11:14:32 AM
Just the link.. Like I said.. I'm limited by the firwall with what I can do. I can't make edits or upload and some content is blocked.
Flash is a no no, and streaming media.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: Zetan on February 07, 2008, 11:23:40 AM
I have to mention this again.. But there are snippits in the Block Code Snippets board for banner rotation, mini banner scrollers. I would use one of those to be honest, and follow the instructions.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: antechinus on February 07, 2008, 11:31:12 AM
Hmmmm, might have to look at them then. Personally I'd prefer a static display if possible though.
Anyway I'm knocking off for the night  (GMT+11 here) so there's no rush on this.
Cheers.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: Zetan on February 07, 2008, 11:33:05 AM
Working image
http://**************.com/images/**********.gif

Non working image
http://www.*************.com/**************.com/images/***********.gif

URLs removed for privacy

Seems to me that you have the image URL twice in the path and the browser is looking for an image in a place that does not exist.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: antechinus on February 07, 2008, 11:47:58 AM
Eh? How'd you get that?  ??? I'm looking at the code now and I can't see that anywhere. It's exactly as I posted it earlier in the thread. There's only one that links to the public forum from the test forum (same domain name, of course) and it works just fine. 

<a href="http://our_mob.com/" target="_blank"><img src="http://our_mob.com/images/stinkylinky.gif"  border="0" ></a>
</br>


It's the one at the top of the list. I'll edit out the domains, etc in my earlier post and you can take a look at the joint at your leisure so you can check the code yourself. I need sleep. Cheers.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: Lesmond on February 07, 2008, 11:51:38 AM
try this in a script block
<div align="center">
<table border="0" width="100%" id="table1" cellspacing="0" cellpadding="0">
<tr>
<td align="center"><a href="http://councilofexmuslims.com/" target="_blank"><img src="http://councilofexmuslims.com/images/MurtadHeavenlinky.gif"  border="0" ></a><p><a href="http://ex-muslim.org.uk/" target="_blank"><img src="http://councilofexmuslims.com/images/CEMBlinky.gif"  border="0" ></a></p>
<p><a href="http://www.ex-muslime.de/" target="_blank"><img src="http://councilofexmuslims.com/images/CCEMlinky.gif" border="0" ></a></p>
<p><a href="http://www.ex-muslime.com/" target="_blank"><img src="http://councilofexmuslims.com/images/CEMScanlink.gif" border="0" ></a></p>
<p><a target="_blank" href="http://www.rantsnraves.org/">
<img border="0" src="http://councilofexmuslims.com/images/rNrButton_150x34.gif" width="150" height="34"></a></p>
<p><a href="http://www.nontheistnexus.com/" target="_blank">
<img src="http://councilofexmuslims.com/images/nexusButton_150x34.gif" border="0" width="150" height="34" ></a></p>
<p><a href="http://www.stophonourkillings.com/" target="_blank">
<img src="http://councilofexmuslims.com/images/ICAHKlink.gif" border="0" width="150" height="35" ></a></p>
<p><a href="http://richarddawkins.net/" target="_blank">
<img src="http://councilofexmuslims.com/images/RDlinky.gif" border="0" width="150" height="35" ></a></p>
<p><a href="http://www.iheu.org/" target="_blank">
<img src="http://councilofexmuslims.com/images/IHEUlinky.gif" border="0" width="149" height="35" ></a></p>
<p><a href="http://www.galha.org/" target="_blank">
<img src="http://councilofexmuslims.com/images/galhalinky.gif" border="0" width="150" height="35" ></a></td>
</tr>
</table>
</div>
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: Zetan on February 07, 2008, 11:52:29 AM
Right click the image, view properties.. When I copied the URL to the image and removed the duplicate, it displayed fine.

I'm 99.9% certain that is the problem.

As G6 stated earlier.. you do not need the full URL for locally hosted content.

/images/stinkylinky.gif

is fine.

For external conent, a full address is needed.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: antechinus on February 07, 2008, 12:05:46 PM
Ok, I'll go through it and edit it to just  images/linkysnstuff.gif
Didn't know about the local hosting stuff.


ETA: Ummm, it's working now. All of them. Right, bury this thread before it rises from the dead again. I'm going to sleep now. Thanks for everything.
Title: Re: Code for linking 150x35 icons to other sites in TP side panel?
Post by: G6Cad on February 07, 2008, 12:15:30 PM
I mark this as solved then ( no more support posts in this topic please)