~ 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.
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!
**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! ***
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.
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:
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:
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 ofUnder 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:
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):
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.
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...