[xxsP] XenXero Site Previewer

[EQnoble]

XenXero Site Previewer​

powered by jLink​

____________________________________​

Requirements: King Kovifors BBCM ( BBcode Manager ) , xxsP_bbcode​

Can you tell that I like jQuery and it's inclusion in XenForo . This addon is a basic integration of an awesome jQuery plugin I came across called j-Link-Previewer which was written by a nice guy named Sarpdoruk Tahmaz who I had a chance to speak to when a question of mine came up and he was more than helpful and quick to answer. For that he get's the first paragraph of this OP. So thank you sir

This addon basically allows you to post a link and show a preview screenshot of that site utilizing a bbcode so that site members may opt to use this instead of just a standard click-able link. I thought it was classy so I whipped it up into a quick addon for everyone's enjoyment. The screenshots have a small watermark that get thrown in for free use and for a small fee per year you can have brand free images. I myself don't mind the waterwark but will be getting rid of it at some point soon.

You hover a link...it overlays a snapshot of the link location. Pretty simple.

To test it register@... http://xenxero.com/threads/xxsp-demo-thread.15/

Usage:

[site=xenforo.com]This get's displayed[/site]

do not use http:// or www... simply use the domain.extension such as xenforo.com, what you type between the tags becomes the link text. Some sites like youtube need the www to achieve the snapshot.

for sites that cannot redirect www and use http:// only you can use [http]
I will use this example... http://hubble.nasa.gov/

[http=hubble.nasa.gov]I can see the stars[/http]

------
in pages you may also use this....

<a class="jQlinkPre" title="This is my website" href="http://xenxero.com">Click me</a>

title="" gets displayed in the header area of the overlay, href="" is the place you want a snapshot of as an overlay, Where you see 'Click me' you would enter what ever text or image you want.

...for instance you could use a logo as the clickable and on hover have it display the preview shot.

________________________________________

Installation:

1. Extract the contents of the xxsP.v.1.0.1.zip file.
2. Upload the contents of the UPLOAD directory to the folder you have xenforo installed in.
3. Install/import the addon-xxsP.xml
4. Import the bbcode_site.xml and the bbcode_http.xml into the custom BBcode manager

 

[EQnoble]

Updated: Added another bbcode. This handles an issue of grabbing screenshots from sites that require either http://www or http://

 

[Peggy]

Well well well this is certainly interesting!

 

[Sylar]

I do agree! Nice little mod

 

[a legacy reborn]

Someone has too many brilliant ideas in their mind...I'm jealous! *crys in corner...*, but seriously nice mod .

 

[Eliteoomph]

1. Import the bbcode_site.xml and the bbcode_http.xml into the custom BBcode manager?

do I install this the same way as the addon or am I suppose to do something different?

 

[EQnoble]

Well you install the addon as it says but I will try and be simple and clear for you here instruction wise...I will then follow with an explanation of how it works.

1. download xxsP.v.1.0.1.zip and extract it.
2. Upload the contents of the UPLOAD folder meaning the library folder inside to your xenforo forum installation root.
3. In your xenforo admin CP you will need to click install addon
4. In the 'install from uploaded file' field click and browse to where you extracted the xxsp.v.1.0.1.zip then click install.
5. *note that you need to have King Kovifor's bbcm installed as it is what gives power to the bbcodes.
6. Assuming you already have bbcm installed..in your admin cp there will be a link under 'BB Code & Smilies' called BB code manager
   
7. Then you would import both bbcode_http.xml and bbcode_site.xml by clicking import new bbcode as pictured below
   
   
8. Browse to where you have extracted the contents of the addon's zip file and import the two by repeating this process for each.
   

And now you are done.

Basically the addon itself supplies xenforo with the pluggin that powers this addon all and all. The content is manually generated by members via bbcodes thus needing a custom bbcode to allow the info to be transformed to a nice visual by the scripts included in your xf when you install this addon. Because of this you need the bbcode manager which facilitates easy adding of custom code geared toward bolstering your users ability and overall experiance.

If you dont have bbcm you will need it as it is a prerequisite for this little addon here. I hope this helps you out.

Someone has too many brilliant ideas in their mind...I'm jealous! *crys in corner...*, but seriously nice mod .

Ha! that made my day Seriously though if you only knew...i have tons of ideas..problem is most of em suck No but really I have lots of ideas...the problem is I am the nubliest of nubcakes and literally have to learn everything I am doing as I am doing it. If I was screwin round with people who knew what they were doing..we could probably come up with a serious set of mods...though I can't say I would be much help with that programmatically.

I have some other cool stuff if you want to check it out...not necessarily xf related but still true geek stuff. I am on skype if you wanna check it out.

 

[Eliteoomph]

Thanks! ;o) I had literally just finished installing the bb code manager a few minutes ago and tested it and got it to work... One prob I have noticed though.

At first I went and registered on your site and tried it there... The little button looking thing would pop up but not screen even when i copied the exact code used in the post above mine which worked fine for me. I went back 15 mins later and then it seemed to work... weird... also I have it installed on my forum... same thing didn't work at first but a few minutes later I noticed it worked and the site preview popped up...

Any reason this might be happening?

 

[EQnoble]

When you post the script that converts the link to an overlay runs once at the loading of all the templates...so when you post it literally is just a link with some css, if you refresh the page immediately after posting it the script runs again and on the fly it is converted to the overlay image preview.

I suppose I could look into having the script run again after a post submission...we'll see if that is an option at some point. I was aware of that before but I figured it was overkill as the person posting the link knows what it is and probably wont need to look at it immediately after posting. If it doesn't break anything I will add the functionality and update the addon.

 

[Eliteoomph]

oh ok that makes sense... as long as all my users do not experience the delay then that sounds good to me... cool addon man! you did a great job!

 

[Edrondol]

Is there a way for sites to block this? I tried by using pvponline.com and it wouldn't work, even though CNN, YouTube and others worked.

Never mind. I had to refresh them to get them to work. But they work.

 

[Edrondol]

Okay, new thing. I have a couple users who can not see this. They both use IE8. I was able to duplicate. IE8 just shows a box outline of where the preview would be.

 

[EQnoble]

pasted from this link in the OP- powered by jLink
Browser compatibility

• Chrome 4+
• Safari 4+
• Firefox 3.5+, Firefox 3.0
• Opera 10.15+

Internet Explorer support is planned in upcoming versions.

 

[Edrondol]

I totally missed that. Ignore me, please.

Never mind. From a link you say? I'm not surprised I missed it. Stop ignoring me!

 

[EQnoble]

HA!

 

[glorify]

Looks great. Will add in.

 

[Edrondol]

A user of mine could not get it to work with the page

halifax.ca/hrwc/CommissionerRichardButts.html

Does it not like the .ca?

 

[EQnoble]

[http=halifax.ca/hrwc/CommissionerRichardButts.html]Mr. Butts[/http]

have him try that....

if [site] doesn't work, 99% of the time the [http] tag will work.

Also remember if you have not already to download the newest version of this which includes the second bbcode [http] which is needed by some sites for some reason.

 

[ManuTdi]

It could create a button to the text editor?

 

[whitetigergrowl]

Yeah I'm not sure either how to have it create a button in the editor. What would be kinda cool is to have it auto-added to links when the links are added.