OWS Basic Info

Daily OWS News

Photobucket

Photobucket

We are....
~ firefly-dreaming
a virtual home to learn (or teach!) alternative methods of solving problems we find facing us each day. By sharing ideas & knowledge on living with less stress, more joy & embracing tolerance & compassion we are working towards building a sustainable future for all living beings.


please if you can...
help us glow brightly!

~OR~ if you'd prefer

Payment Options
Remember, you can always



Facebook

Do it DAILY!
Photobucket
Just a few seconds of your time can make a BIG difference
in someone's life....


PhotobucketPhotobucket

be sure to click on ALL the top tabs at Click2Give!
Photobucket

be sure to click on ALL the side tabs at Care2!
Photobucket

Photobucket

Fight World Hunger






Brighter Planet's 350 Challenge

The Small Is Beautiful Manifesto

Photobucket

Greenpeace


I Support WWF





HTML Photo/Video Help

  

by: RiaD

Wed Feb 17, 2010 at 16:14:52 PM EST


if you have an urgent question not answered here
or~
you have a suggestion for an addition to this page
Please either ask in the most recent "open thoughts"
or write to me:
RiaD AT firefly-dreaming DOT com
(take out ALL spaces and change AT to @ and DOT to .  )  

This is an HTML Photo & Video guide so that you too will be able to embed beautiful pictures  or wonderful videos
in your Posts and Comments & have them come out eXactly the way you envision them!

Many of these were liberally lifted from docudharma's HTML help page, put together by Edger & On The Bus.

Another source of help for posting Photos is Eddie C's dkos diary:
Posting pretty good photos at DailyKos without spending a penny




**WARNING!!!**
*** We really like pictures here! ***
We encourage you to put a picture in the Main Text (top section)of your post & sprinkle them in the extended text if you'd like.

Posts that have NO pictures in the Main Text area will set off a default program.... swarms of fireflys will search diligently throughout every picture to find the perfect picture then present it to be added by one of the editors here.

Did i mention.....
*** We really REALLY like having pictures here! ***


RiaD :: HTML Photo/Video Help

--- POSTING PICTURES ---

Photobucket

To post a picture in your article, you'll need the URL (web address) of the picture.  

It's best to upload pictures to a Flickr or Photobucket account(or some other image host)
rather than linking directly to a picture on someone else's site
(aka Hot Linking).



It's very easy to set up an account, upload your pictures then, copy & paste the URLs of your pictures into your comment or essay.   Below each picture you'll find the HTML code to put in your post.  There will be a box that says "copy/paste this code to your website" or something to that effect. Right click on this box & click on 'copy' to transfer the code to your clipboard, then right click in your essay or comment where you want to put the picture & click 'paste'.

(or you can highlight the code with your mouse, press 'control' AND 'C' to copy, then press 'control' AND 'V' to paste)

Also please be aware of copyright issues. It is best to find "free" or "fair-use" pictures.  If you use someone else's picture, provide a link to the page you found it on, if possible.  

The following line of code will display a picture in your article. Replace the URL in this example with the URL of the picture you want to display (change only the address between the quote marks), and adjust the width to your preference (use "preview" to make adjustments). The height will be auto-calculated proportionally - you do not need to specify it.

<img src="http://i203.photobucket.com/albums/aa13/RiaDreams/fireflies/firefly%20ART/c74a.jpg” width="300" align=”left”>


You can set the "align" parameter to "left" or "right", to display your picture on either side of the article page.
To center your picture see below for instructions!

To RESIZE your photos

In Photobucket:
Get the code from the section that says HTML code
Copy & paste it into your essay or comment.
It will look like this:

<a href="http://s203.photobucket.com/albums/aa13/RiaDreams/fireflies/firefly%20ART/?action=view¤t=c74a.jpg” target="_blank”><img src="http://i203.photobucket.com/albums/aa13/RiaDreams/fireflies/firefly%20ART/c74a.jpg” border="0" alt="Photobucket"></a>


Now. Add in width="350"
Be sure to leave a space between your width parameter and border parameter!

<a href="http://s203.photobucket.com/albums/aa13/RiaDreams/fireflies/firefly%20ART/?action=view¤t=c74a.jpg” target="_blank”><img src="http://i203.photobucket.com/albums/aa13/RiaDreams/fireflies/firefly%20ART/c74a.jpg” width="350" border="0" alt="Photobucket"></a>


You can change your width parameter (the number) to suit your needs.
"125" makes very small pictures. Here at firefly-dreaming you can fit five or six of these across the page.
"500" makes a large picture.

NOTE: Please don't post pictures wider than 500px.
Images larger than 500px wide in essays may be edited.
Images larger than 500px wide in comments may be deleted by Administration (ME- RiaD!) because they may adversely affect some browser displays. (also known as "breaking the page" or "breaking the blog"

Please be aware of where your comment is on the page. If you are replying to someone whose comment is on the far right of the page AND you are adding a picture... it would be better to reply to the essay to add in your picture then reply to the comment and direct their attention to your comment which will be at the bottom of the page.



--- WRAPPING TEXT AROUND PICTURES ---


TO MAKE YOUR ARTICLE TEXT "WRAP", (display BESIDE and BELOW your picture), begin typing the text of your article immediately following the image code:  

<img src="http://i203.photobucket.com/albums/aa13/RiaDreams/fireflies/firefly%20ART/c74a.jpg” width="200" align="left">START TYPING YOUR ARTICLE TEXT HERE.....

text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

TO CENTER YOUR PICTURE and display your article text BELOW it, REMOVE the "align" parameter from the image code line, and enclose the entire image code line in center tags:

<center><img src="http://i203.photobucket.com/albums/aa13/RiaDreams/fireflies/firefly%20ART/c74a.jpg” width="200"/></center>

START TYPING YOUR ARTICLE TEXT HERE.....



text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...text of article...







--- POSTING VIDEOS ---


YouTube videos are the most popular video format but there are others that will allow you to embed as well.  

To the right of Under the video on the YouTube page you'll see a box with the title "embed" beside in it. Click on that box. A box will open up below it full of code. It will already be 'highlighted'. Copy the code from that box and paste it into your essay or comment.

When you find a YouTube video elsewhere, that you'd like to post, obtain the "embed" code for that video by clicking on the YouTube logo at the bottom right corner of the video which will take you to the YouTube page for that video. Or click on "Menu" in the lower right corner of the video and it will display the embed code for you in the video image.





The "embed" code for that video (available by clicking the YouTube logo) looks like this, and if pasted into your article will display the video aligned against the left margin, as above:

<object width="480" height="295"><param name="movie" value="http://www.youtube.com/watch?v=tSc9ftJ-_TA&hl=en_US&fs=1&rel=0"></param><param name="allowFullScreen" value="true"></param><embed src="http://www.youtube.com/watch?v=tSc9ftJ-_TA&hl=en_US&fs=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" width="480" height="295"></embed></object>






To post a video in your article centered on the page, simply enclose the "embed" code in center tags (the same as centering pictures, as described above):

<center><object width="480" height="295"><param name="movie" value="http://www.youtube.com/watch?v=tSc9ftJ-_TA&hl=en_US&fs=1&rel=0"></param><param name="allowFullScreen" value="true"></param><embed src="http://www.youtube.com/watch?v=tSc9ftJ-_TA&hl=en_US&fs=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" width="480" height="295"></embed></object></center>



Posting that code in your article will display the video centered on the page:







You can also shrink videos by removing the height parameter in both places where it appears in the code and setting the width to a smaller amount of pixels.

<object width="250"><param name="movie" value="http://www.youtube.com/watch?v=tSc9ftJ-_TA&hl=en_US&fs=1&rel=0"></param><param name="allowFullScreen" value="true"></param><embed src="http://www.youtube.com/watch?v=tSc9ftJ-_TA&hl=en_US&fs=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" width="250"></embed></object>








to get rid of the TITLE & STARS on you tube videos:


There are two places in youtube embed code where you'll find "fs=1"... just replace it in both places with "showinfo=0"


<object width="480" height="295"><param name="movie" value="http://www.youtube.com/watch?v=tSc9ftJ-_TA&hl=en_US&showinfo=0&rel=0"></param><param name="allowFullScreen" value="true"></param><embed src="http://www.youtube.com/watch?v=tSc9ftJ-_TA&hl=en_US&showinfo=0&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" width="480" height="295"></embed></object>







YOU-TUBE FIXES

On some SoapBlox sites (my left wing for example) you-tubes will not embed just by copy/pasting the embed code.

Do the following to get the things to embed & post!

Near the end of the code find the place where it says allowscriptaccess="always" ..... delete this part & only this part!! be sure you have a space between shockwave-flash" & allowfullscreen...

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


Poll
this page was
no help at all
a bit helpful
helpful
very helpful

Results

Tags: , , , , (All Tags)
Print Friendly View Send As Email

- You can use Disqus, Google, Twitter, Facebook, Yahoo or OpenID accounts to comment


Photobucket



Since February 19, 2010


Need HELP setting up your website or blog? Have a site & want to give it more oomph?
Contact Edger at: edger10 {at} gmail {dot} com
Menu

If you would like to join us
you'll need an account

Please Click Here
to make one

Username:

Password:



Forget your username or password?




Follow DreamerFirefly on Twitter

Active Users
Currently 0 user(s) logged on.



Search




Advanced Search

moon phases

CURRENT MOON


Links to Enjoy

In The Spotlight

~Plutocracy Files~

Radical Radio
~Left-Wing Radio Stations~

~Political Discontent Radio~

Brilliant Blogs
~Antemedius
~Be-Think
~Burning the Midnight Oil
~Cabaretic
~Daily Kos
~DocuDharma
~The Dream Antilles
~dubious ventures
~Ethicurean
~fake consultant
~Firedoglake
~Hecate
~Ignoring Asia
~La Vida Locavore
~Lets Japan
~Margaret & Helen
~Minimalist Photography
~The Minimalist Woman
~Muskegon Critic
~My Left Wing
~New Progressive Alliance
~Original Cin's
~patricjuillet
~Pioneer Woman Cooks!
~Right of Assembly
~The Stars Hollow Gazette
~Street Prophets
~Timbuk3
~White Knuckles
~Wild Wild Left
~Wise Living Journal
~

~Fun Finds

~Good Places

~
Interesting~

~
Spiritual Sites

~
Ready Resources

~
Weather



Powered by: SoapBlox