Help - Search - Members - Calendar
Full Version: how do you embed the showit code on a wordpress blog?
OpenSourcePhoto > GetIt > Showit Web
the real tami
i got the code at the end when i created the showit, but when i went to add it to my blog, it didnt work.

i click on the icon to 'add video' and it gives me a place to add a link or how to add a you tube video wtih the [youtube=] bit but that doesnt work for showit.

anyone figure this out already?

thanks
LisaC
Tami, I am trying to add to Typepad. But my problem is that I cannot get the command-click to work so I can copy and paste the html code...I have a support ticket in to see if I can get an answer. Maybe once I get that I may be able to help:)
JimCook
Just take the code that showit has and in wordpress switch to html mode and past it into the most and save it.
the real tami
QUOTE(JimCook @ May 27 2008, 01:11 PM) *
Just take the code that showit has and in wordpress switch to html mode and past it into the most and save it.



paste it into the what? (i feel like i am talking to myself... so confusing.....)
JimCook
Do I need to airplane.gif over there and show you? laughing.gif

Ok in the advanced section of showit it has the embed code you need. That is what you paste.

In wordpress... Create a new post. Give it a title. Switch the edit mode to html and paste the stuff from showit into there and then save the post.

the real tami
QUOTE(JimCook @ May 27 2008, 01:17 PM) *
Do I need to airplane.gif over there and show you? laughing.gif

Ok in the advanced section of showit it has the embed code you need. That is what you paste.

In wordpress... Create a new post. Give it a title. Switch the edit mode to html and paste the stuff from showit into there and then save the post.


oh i see, ok i will give it a try. thanks
the real tami
QUOTE(JimCook @ May 27 2008, 01:17 PM) *
Do I need to airplane.gif over there and show you? laughing.gif

Ok in the advanced section of showit it has the embed code you need. That is what you paste.

In wordpress... Create a new post. Give it a title. Switch the edit mode to html and paste the stuff from showit into there and then save the post.



i did it and nothing happened. just a blank post.
Phil P
ok, here i am! Here's how I do it

<script type="text/javascript" src="swfobject.js"></script>
<p id="flashcontent">This text is replaced by the Flash movie.</p>
<script type="text/javascript"> var so = new SWFObject("http://www.yourserver.com/slideshowA/showit.swf", "showit_swf", "600", "400", "8", "#000000"); so.addParam("quality", "best"); so.addParam("wmode", "transparent"); so.addParam("salign", "lt"); so.addParam("loop", "false"); so.addParam("flashvars", "showit_embed=http://www.yourserver.com/slideshowA/|600|400|1|0|0"); so.write("flashcontent");</script>

make sure to get a copy of swfobject.js and put it in your blog directory, this provides a fix for Internet explorer users who have to click on flash stuff to activate, plus if you add text to the "flashcontent" area, you can add text so you can be seen by the search engines. Good times!
the real tami
QUOTE(Phil P @ May 27 2008, 08:24 PM) *
ok, here i am! Here's how I do it

<script type="text/javascript" src="swfobject.js"></script>
<p id="flashcontent">This text is replaced by the Flash movie.</p>
<script type="text/javascript"> var so = new SWFObject("http://www.yourserver.com/slideshowA/showit.swf", "showit_swf", "600", "400", "8", "#000000"); so.addParam("quality", "best"); so.addParam("wmode", "transparent"); so.addParam("salign", "lt"); so.addParam("loop", "false"); so.addParam("flashvars", "showit_embed=http://www.yourserver.com/slideshowA/|600|400|1|0|0"); so.write("flashcontent");</script>

make sure to get a copy of swfobject.js and put it in your blog directory, this provides a fix for Internet explorer users who have to click on flash stuff to activate, plus if you add text to the "flashcontent" area, you can add text so you can be seen by the search engines. Good times!



huh? what???? blink.gif i'm not geek inclined by any means so this is just gibberish to me.
Phil P
QUOTE(the real tami @ May 27 2008, 03:26 PM) *
huh? what???? blink.gif i'm not geek inclined by any means so this is just gibberish to me.


I'll do a screenprint tutorial when I get home, don't despair!!!
the real tami
QUOTE(Phil P @ May 27 2008, 09:31 PM) *
I'll do a screenprint tutorial when I get home, don't despair!!!



ok thanks!
Lauren Jennings
QUOTE(the real tami @ May 27 2008, 04:41 PM) *
ok thanks!

hey hey!!! I also have a wordpress blog and had this problem, but I figured it out! It's pretty simple.

When you do the post and you are ready to insert the slideshow, click the little button that says <code> at the top, and it will automatically put that part in, THEN copy and paste the embed code from ShowIt, and then click the little <code> button again, which will now put the end bracket on it.

So it will look like this: <code>embed code from Showit</code>
and voila! It should work smile.gif
the real tami
QUOTE(Lauren Jennings @ May 29 2008, 03:16 PM) *
hey hey!!! I also have a wordpress blog and had this problem, but I figured it out! It's pretty simple.

When you do the post and you are ready to insert the slideshow, click the little button that says <code> at the top, and it will automatically put that part in, THEN copy and paste the embed code from ShowIt, and then click the little <code> button again, which will now put the end bracket on it.

So it will look like this: <code>embed code from Showit</code>
and voila! It should work smile.gif


thank you so much lauren, i will try it later!
Lauren Jennings
QUOTE(the real tami @ May 29 2008, 10:20 AM) *
thank you so much lauren, i will try it later!


You're welcome! yltype.gif
Phil P
figures i totally flaked on preparing that tutorial. it will get done! lol
the real tami
QUOTE(Lauren Jennings @ May 29 2008, 03:16 PM) *
hey hey!!! I also have a wordpress blog and had this problem, but I figured it out! It's pretty simple.

When you do the post and you are ready to insert the slideshow, click the little button that says <code> at the top, and it will automatically put that part in, THEN copy and paste the embed code from ShowIt, and then click the little <code> button again, which will now put the end bracket on it.

So it will look like this: <code>embed code from Showit</code>
and voila! It should work smile.gif



nothing happened. i did exactly as you said, but nothing is showing, in fact, when i do a preview and then go back to the post, the code has disappeared?
Lauren Jennings
QUOTE(the real tami @ May 29 2008, 02:00 PM) *
nothing happened. i did exactly as you said, but nothing is showing, in fact, when i do a preview and then go back to the post, the code has disappeared?


Hm. Weird, it always works for me like that. Try publishing it and see if that makes it work?
the real tami
i did. nodda. you know i just have basic blog, nothing fancy, i have the upgraded code thing but have no idea what to do wth it. i think i am missing somethign somewhere...
Lauren Jennings
QUOTE(the real tami @ May 29 2008, 02:10 PM) *
i did. nodda. you know i just have basic blog, nothing fancy, i have the upgraded code thing but have no idea what to do wth it. i think i am missing somethign somewhere...



Hm. I really don't get it. Have you tried just using the IFrame code? that always worked on my old blog, then I got Wordpress and I had to figure out how to work it. Have you posted slideshows before? Because I had a heck of time the first time I ever did it and I might know what is wrong if you have never posted before.
the real tami
QUOTE(Lauren Jennings @ May 29 2008, 07:22 PM) *
Hm. I really don't get it. Have you tried just using the IFrame code? that always worked on my old blog, then I got Wordpress and I had to figure out how to work it. Have you posted slideshows before? Because I had a heck of time the first time I ever did it and I might know what is wrong if you have never posted before.
no, i have never done tis before. codes, etc. make me go insane...... i'll try the iframe code and see waht that does..... fingers crossed.nope that did not work either.
Lauren Jennings
QUOTE(the real tami @ May 29 2008, 02:26 PM) *
no, i have never done tis before. codes, etc. make me go insane...... i'll try the iframe code and see waht that does..... fingers crossed.nope that did not work either.



Ok Tami- here is my phone number, call me and i'll try to talk you through it smile.gif 850-830-4670
Michelle G
Oh, I need to try this. I'm having the same problem. I just have not spent much time trying to figure it out.
Phil P
here's some more detail on my earlier post, hopefully it can provide better direction. trust me, this works smile.gif

Embedding showit web into your blog (Internet Explorer friendly version)

Step 1: http://blog.deconcept.com/swfobject/#download Download swfobject, unzip and upload swfobject.js and upload it into your blogs main directory ( http://www.yourserver.com/blog/swfobject.js)

Step 2: Go into wordpress, write a post, click on CODE and paste this in

<script type="text/javascript" src="swfobject.js"></script>
<p id="flashcontent">type in text here so google knows the content</p>
<script type="text/javascript"> var so = new SWFObject("http://www.yourserver.com/slideshows/slideshowname/showit.swf", "showit_swf", "600", "400", "8", "#000000"); so.addParam("quality", "best"); so.addParam("wmode", "transparent"); so.addParam("salign", "lt"); so.addParam("loop", "false"); so.addParam("flashvars", "showit_embed= "http://www.yourserver.com/slideshows/slideshowname/|600|400|1|0|0");" so.write("flashcontent");</script>

Step 3: This is where we take my code and customize it for your specific slideshow. Where it says "showit_swf", "600", "400", "8", "#000000"); Make sure you replace 600 and 400 with the width and height of your slideshow (I made mine 600px by 400px in this example) #000000 is what the background color of the show is, mine is black, but you can make it white by typing #ffffff or using photoshop to find whatever other color you want

Replace the 600 and 400 accordingly where it says "showit_embed= http://www.yourserver.com/slideshows/slide...0");" again, it's the width and height of the show

Replace http://www.yourserver.com/slideshows/slideshowname with whatever directory you place your slideshows

If you type in the width and height of your shows, along with the directory where your slideshow is, I can generate the specific code for your situation. The key though is getting that swfobject.js file into your blog's main directory.

Best of luck all!
Rich Smith
What version of Wordpress do you have?

You just need to make Phil an temp admin on your blog so he can go in and check things out. (sorry for volunteering you, Phil). smile.gif
Phil P
hehe, no prob rich, it would likely make it easier really, i promise i won;t create a post saying how great i am!
Rich Smith
QUOTE(Phil P @ May 29 2008, 04:27 PM) *
hehe, no prob rich, it would likely make it easier really, i promise i won;t create a post saying how great i am!

However, you can create a post saying how great I am though! thumbsup.gif
the real tami
QUOTE(Rich Smith @ May 29 2008, 09:39 PM) *
However, you can create a post saying how great I am though! thumbsup.gif



how do i make him admin? sorry, i know nothing. smashpc.gif
Phil P
to create a new user, click users in wordpress and you can add new user
the real tami
lauren, we figured it out - i do not host my own blog so i can't imbed. but phil has promised to help me load it onto my own server so i can!
Phil P
QUOTE(the real tami @ May 30 2008, 02:35 PM) *
lauren, we figured it out - i do not host my own blog so i can't imbed. but phil has promised to help me load it onto my own server so i can!


word!
Lauren Jennings
QUOTE(Phil P @ May 30 2008, 03:39 PM) *
word!


Ok Tami!!! Best of luck with this, make a post to this when it you post your first slideshow! I can't wait to see it! smile.gif
the real tami
QUOTE(Lauren Jennings @ May 30 2008, 10:08 PM) *
Ok Tami!!! Best of luck with this, make a post to this when it you post your first slideshow! I can't wait to see it! smile.gif



lauren which was that template you said was for photographers?
Lauren Jennings
QUOTE(the real tami @ May 30 2008, 05:15 PM) *
lauren which was that template you said was for photographers?


Actually I'm not sure, someone designed it for me and she downloaded the template. I just know that there is one that is supposedly for pro photogs... sad.gif Sorry wish I could be of more help on that but i'm such a dunce... hence why I have to pay someone else to do it for me LOL!
Eric Koch Photo
I do it a little differently. Check it:

My wordpress Blog

Let me know if you would like to know how I do it.
the real tami
QUOTE(Eric Koch Photo @ June 2 2008, 05:49 AM) *
I do it a little differently. Check it:

My wordpress Blog

Let me know if you would like to know how I do it.



i do, cause we installed wordpress on my server and it still doesnt work. thnks!
Eric Koch Photo
Checklist to add the slideshows to wordpress the way I do (must be hosting wordpress on your server):

1. Install Wordpress on server

2. Install Graybox (that is part that makes it pop up in the cool window) on server
a. Download the graybox files from the link above or my black version here
b. unzip the files and add them to base folder of your site
c. add the following code to your template's header file in wordpress (right above
CODE
<?php wp_head(); ?>
) (in wordpress go to design, theme editor, then select header from the menu on the right)
CODE
<script type="text/javascript">
    var GB_ROOT_DIR = "/greybox/";
</script>
<script type="text/javascript" src="/greybox/AJS.js"></script>
<script type="text/javascript" src="/greybox/AJS_fx.js"></script>
<script type="text/javascript" src="/greybox/gb_scripts.js"></script>
<link href="/greybox/gb_styles.css" rel="stylesheet" type="text/css" />


3. Upload "Click to play" image to server (here is mine)

4. Create slideshow in Showit (I use 700 x 500 for the size), use template to make it fit in the window right (You can download mine HERE, to use it go to controls, advanced, then open it {at the bottom})

5. Upload show to sever. (I suggest opening it on the server by it's self so you know it is working)

6. add the following link (go to the html tab) to your post in wordpress
CODE
<p style="text-align: center;"><a title="Wedding Slideshow" onclick="return GB_showCenter('CHANGE THIS TO YOUR SHOW TITLE', this.href,550,740)" href="http://www.YOURSITE.com/SLIDESHOWFOLDER/SLIDESHOW/index.html"><img class="size-full wp-image-75" title="seetheslideshow" src="http://www.YOURSITE.com/FOLDERWITHPLAYSHOWIMAGE/seetheslideshow.jpg" alt="" width="200" height="167" /></a></p>
Eric Koch Photo
I have been showing Showit slideshows on Wordpress for about 8 months now without a problem.

If you are having issues here are a couple things to check:

1. Your show-it slideshow is uploaded to your server and WORKING (open it directly on the web and watch it play)

2. You have the location of the show right in the publish tab of Showit (you can copy and paste this from your web browser when you open the show to check it)

3. To add it to your wordpress blog I suggest using the embed code that showit gives you. Steps:
a. Make new post and write your entry until the point you want the slideshow
b. go to the HTML tab
c. click on the code button
d. paste in the embed code from show-it
e. click on the code button again to close the code tag
f. go back to the visual editor to finishing writing your post.
g. publish and check to see if it is working
the real tami
QUOTE(Eric Koch Photo @ June 3 2008, 06:46 AM) *
I have been showing Showit slideshows on Wordpress for about 8 months now without a problem.

If you are having issues here are a couple things to check:

1. Your show-it slideshow is uploaded to your server and WORKING (open it directly on the web and watch it play)

2. You have the location of the show right in the publish tab of Showit (you can copy and paste this from your web browser when you open the show to check it)

3. To add it to your wordpress blog I suggest using the embed code that showit gives you. Steps:
a. Make new post and write your entry until the point you want the slideshow
b. go to the HTML tab
c. click on the code button
d. paste in the embed code from show-it
e. click on the code button again to close the code tag
f. go back to the visual editor to finishing writing your post.
g. publish and check to see if it is working


its still not working, even though i now have the upgraded version of wordpress, with the prophoto template. i have tried the method you have listed above, and it still does not work.

the other method you posted, well... there is no way i could ever accomplish that, i have no idea how to even load that stuff onto the server.

i am at my wits end, i bought showit and asked blu to add on the video add on, thinking i could run my showit through that - i even asked them if it was compatible - in their roundabout way of answering they just installed the video add on and charged me $150. it wasnt until later when we couldnt get it to work, that they finally admitted that their video add on is not compatible with showit. daz.gif

so now i decided of going the route of posting my showits on my blog - then after trying for two days to figure it out, we realized it was becasue i only had the basic wordpress template, not the upgraded kind.

so even now with the upgraded version, it still does not work. woe is me. wacko.gif
JimCook
QUOTE(the real tami @ May 29 2008, 04:40 PM) *
how do i make him admin? sorry, i know nothing. smashpc.gif


While you are making one -- add me! ph34r.gif
the real tami
QUOTE(JimCook @ June 3 2008, 01:37 PM) *
While you are making one -- add me! ph34r.gif



i did. didnt you get the notification?
JimCook
QUOTE(the real tami @ June 3 2008, 08:47 AM) *
i did. didnt you get the notification?


no... must be something wrong with your blu email. laughing.gif

Just post the id and password in here.
the real tami
QUOTE(JimCook @ June 3 2008, 01:58 PM) *
no... must be something wrong with your blu email. laughing.gif

Just post the id and password in here.


ok. no problem.


user name: iamjimcookandiambringingsexyback

password: i'malady

oh and my email is working fine, i got the notification that i won the threadjacking contest and that they are forwarding me a check of all my winnings. clap.gif
JimCook
QUOTE(the real tami @ June 3 2008, 09:01 AM) *
ok. no problem.
user name: iamjimcookandiambringingsexyback

password: i'malady

oh and my email is working fine, i got the notification that i won the threadjacking contest and that they are forwarding me a check of all my winnings. clap.gif



I bumped that thread to see who get's 2nd place...


The id and password didn't work. mad.gif Oh and post your paypal id and password so I can forward the winner their money.
the real tami
!!!YAY!!!

i got it to work! what is so funny is that i did the same thing i have been doing but this time it worked. i am a happy bunny!

too bad its on my new blog whic isnt launched yet....... 17.gif
LisaC
QUOTE(the real tami @ June 3 2008, 11:35 AM) *
!!!YAY!!!

i got it to work! what is so funny is that i did the same thing i have been doing but this time it worked. i am a happy bunny!

too bad its on my new blog whic isnt launched yet....... 17.gif


Tami, glad to see you got it to work. I too am working on my new blog and just tried my first slideshow. Well, it works but it doesn't ask to play like I selected before creating code. It just goes ahead and plays on its own which I don't want. Anyone have ideas? Also, any way that I can get it to be centered in the post?
Eric Koch Photo
QUOTE(LisaC @ June 3 2008, 05:42 PM) *
Tami, glad to see you got it to work. I too am working on my new blog and just tried my first slideshow. Well, it works but it doesn't ask to play like I selected before creating code. It just goes ahead and plays on its own which I don't want. Anyone have ideas? Also, any way that I can get it to be centered in the post?



The ask to play only works if you use the embed code. Make sure you are using that and not the iframe code.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2008 Invision Power Services, Inc.