How to add Tape Strips to your Photos without Photoshop or any other software! + Free Tape Strips

I did this tutorial a while back for Keren from Free Pretty Things for You she asked me to show her readers how to use her cute Tape Strips Freebie on your images. I am also going to show your how to add a vintage touch to your photos. Don’t worry, it is easy and fun. This is the finished product (yes, my silly daughter never takes a normal smiling photo, she thinks that she has to always pull a funny face!):

Tape Strips Tutorial: How to Add Tape Strips to your Images

We are going to use a FREE online software (no download or registration required, you just use it on the internet). The program is Pixlr.com.

If you want to add vintage effects to your photo, then start here, but if you like the photo the way it is, skip to Step #2.

Step #1: Add Vintage Effects to your photo using Pixlr-O-Matic.
Go to pixlr.com and click on “Retro Vintage Effects” to get into Pixlr-O-Matic.

Retro Vintage Effects

I had my daughter do the Webcam image, but you can upload any pic from your computer too.

Take or Upload your Picture

This is what our pic looked like before we made any changes…

Web Camera Picture

I picked the following options as the program took me through each of three steps…

Pixlr Options

Pixlr Options

Pixlr Options

Then I saved it to my computer.

Save to Computer

This is the final outcome of my image…

Vintage Picture

 

———————————————————————–

Step #2: Add your tape strips using the Pixlr Editor, Go back to pixlr.com and click on “Open photo editor”.

Open Photo Editor

Then open the picture that you just edited, or whatever picture that you want to add the tape strips too.

Open Image from Computer

This is the final outcome of my image…

Opened Image

On the top menu bar, click on “Image” and “Canvas Size”.

Image > Canvas Size

Then you need to click on the CENTER box, and add an additional 100px to both the height and width of the image.

Change Canvas Size

Now you will need to open your tape strips, (which can be downloaded here)

Open Tape Strips

When your strips are open, you need to select the “Crop Tool”…

Crop

…and drag it around the tape strip that you want to use, then hit “Enter” or “Return” on your keyboard to crop it.

Crop

Then you are going to need to change to your “Selection” tool (the black arrow)…

Select Tool

…and click and drag the “Layer 0” onto your picture behind it (you may need to move your windows so that you can see the picture behind it).

Drag Layer

The tape strip will probably look really huge, just depending on the size of your picture.

Resize Tape Strip

So you will need to go to the menu bar, and click on “Edit” and “Free Transform”.

Free Transform

Now you can click on on of the Blue Corner dots, and HOLD DOWN THE SHIFT KEY on your keyboard while you drag it smaller. Make sure to hold down the shift key, so that the tape doesn’t get scrunched funny.

Drag Smaller

Once you have it the size that you like, you can use the rotate tool by the blue corner dots to rotate the tape.

Rotate

You can now use the “Selection” tool, to move it and place it where you want it.

Position the Tape Strips

Next, if you want more than one strip of tape, you can click on the tape layer, and drag it to the
new layer icon. This will make another tape strip, which you can then move to the spot you
want and you can do an “Edit”, “Free Transform” to rotate it too.

Duplicate Layer

If you want your tape strips to be slightly transparent, like some tapes. You can click on the
layer and then click on the bottom left icon. There you can change the opacity to something
semi-transparent, but you may not even want to do this step :)

Adjust Opacity

You can see the difference here between the 2 strips.

Almost Done

After you change the transparency of the next strip, all there is left is to save it!

File > Save

Save
There you have it :)

Tape Strips Tutorial: How to Add Tape Strips to your Images

I hope you enjoyed the tutorial!  Below I have posted links to more free tape strips!!

 

1.  Free Washi Tape Download from Bonjour! Blog

Free Washi Tape Strips

 

2.  Free Tape Strips by the Pugly Pixel.

Free Tape Strips

 

3.  Free Clip Art: Tape Strips from the Pugly Pixel.

Free Tape Strips

 

4.  Free Clip Art: Tape Strips (Solid Sequel) by the Pugly Pixel.

Free Solid Tape Strips

 

5.  Mint and Mocha + Free Washi Tape Download by Creature Comforts.

Striped Paper Tape Freebie

 

 

6.  Old Sticky Tape Textures + Photoshop Brushes by Fuzzimo.

Old Sticky Tape Textures Photoshop Brushes

 

 

7.  Free Tape Strips by A is for Ampersand.

Free Tape Strips

 

 

8.  Free Tape Strips Part 2 by A is for Ampersand.

Free Tape Strips

 

 

9.  All Lace Tape Strips by Sweetly Scrapped.

Free Lace Tape Strips

 

Featured on FPTFY, NEW Shop, and a new Freebie!

There are a lot of things going on up in here today :)  #1:  I did a guest post over at Free Pretty Things for You!  I did a Tutorial on how to add tape strips to your images using Pixlr.com, so go check it out!

Free Pretty Things for You

#2:  I have a NEW shop!  Not everything is uploaded yet, and the design is not finished yet, but it works a lot better than the old place.  So check that out here.

Makin' Cute Blogs NEW Digital Design Shop

Lastly:  With the release of the new shop, I made one of my Seamless Pattern/ Paper packs into a freebie!  So now you can get all 4 “Grid Paper” Seamless Patterns and Papers for free!  Click here to get it!  BTW, it is Free for Personal & Commercial Use too!!!

Grid Paper Seamless Pattern & Paper Pack Freebie

A look back at 2011!

There are many things that made 2011 a great year!

First off: You guys! I am so thrilled to report that Makin Cute Blogs’ stats have improve by 10 TIMES since last year at the same time!!  Last year we were seeing approximately 71 visitors per day, this last week, we have averaged over 700 visitors per day!!  I can’t thank you enough for your support, and I hope that we can continue to grow and make this blog even better.

Second:  We have added so many great tutorials and articles.  I wanted to put together a quick recap of last year’s tutorials, just in case you missed any of them.

Thanks for making my 2011 a wonderful year!  You are the best readers ever!

How to Install a Makin’ Cute Blogs Free Blog Background

Makin’ Cute Blogs has decided to ramp up the Free Blog Backgrounds!  The Best Part: My backgrounds don’t have a button displaying in the top corner of your blog!  You get to choose where you want to display the button in your sidebar or footer.  Or, you will now have the option to purchase a background and have no button or credit required at all!

All of the Backgrounds are located here in my shop.  It is really simple and easy to install any of my blog backgrounds.  Just follow these steps:

Download Your File:  Select your free blog background from my shop, and click on  “Free Download” (no sign up needed)Step 1: Go to your Dashboard and Select Template and CustomizeStep 2: In your Template Designer, Select Background and Your Background Image.Step 3: Select Upload Image and Choose File.  This is where you upload your free blog background.Step 4: Change Your Background Settings as Follows:  Center Alignment, Don't Tile, Uncheck Scroll with ImageStep 5: Go to Adjust Widths, and adjust your sizes to fit your new background.Color Changing Backgrounds Only: Go to Advanced and Backgrounds and Change Your ColorDon't Forget!  To save your changes, make sure to select Apply to Blog

Give Credit (required): Go to your Layout Page and Add a Gadget (anywhere you would like)Select HTML/JavaScriptCopy a Button Code Below (pick the one that you like).My Free Blog Background was provided by Makin Cute Blogs

<center><a href="http://makincuteblogs.com/"><img title="Makin Cute Blogs: Free Blog Backgrounds" src="http://makincuteblogs.com/wp-content/uploads/2011/11/MCB-BackgroundButton-1.png" alt="My Free Blog Background was provided by Makin Cute Blogs" width="150" height="200" /></a></center>




My Free Blog Background was provided by Makin Cute Blogs

<center><a href="http://makincuteblogs.com/"><img title="Makin Cute Blogs: Free Blog Backgrounds" src="http://makincuteblogs.com/wp-content/uploads/2011/11/MCB-BackgroundButton-2.png" alt="My Free Blog Background was provided by Makin Cute Blogs" width="500" height="50" /></a></center>




My Free Blog Background was provided by Makin Cute Blogs

<center><a href="http://makincuteblogs.com/"><img title="Makin Cute Blogs: Free Blog Backgrounds" src="http://makincuteblogs.com/wp-content/uploads/2011/11/MCB-BackgroundButton-3.png" alt="My Free Blog Background was provided by Makin Cute Blogs" width="125" height="175" /></a></center>




Paste it in your HTML/JavaScript content area, like seen below.  Then Save.

Congrats!  Now you have a cute background!

How to Put Randomly Rotating Ads on your Sidebar in Blogger

Have you ever wanted to randomly rotate your sponsor’s advertisements on every page refresh? I have finally figured this one out for you!! It is pretty simple too. What is even better, is that it works with any size advertisement!  To see it live, click on the image below.

Screenshot of Randomly Rotating Ads for Blogger

Step #1: Plan for how you want your ads to display… This code will fall one ad after the other, so if you want to display 2 columns of ads, make your sidebar wide enough for 2 ads + a little extra room for the small space in between the ads. If you want them to display 1 after the other, then your sidebar just needs to be a little wider than one ad.

Step #2: Paste the Code below into an HTML/JavaScript Gadget on your Sidebar:

<script language="Javascript" type="text/JavaScript">
var ad = new Array()
ad[0]='<a href="YOUR WEBSITE URL HERE" target="_blank"><img src="YOUR IMAGE URL HERE" border="0"></a>'
ad[1]='<a href="YOUR WEBSITE URL HERE" target="_blank"><img src="YOUR IMAGE URL HERE" border="0"></a>'
ad[2]='<a href="YOUR WEBSITE URL HERE" target="_blank"><img src="YOUR IMAGE URL HERE" border="0"></a>'
ad[3]='<a href="YOUR WEBSITE URL HERE" target="_blank"><img src="YOUR IMAGE URL HERE" border="0"></a>'
ad[4]='<a href="YOUR WEBSITE URL HERE" target="_blank"><img src="YOUR IMAGE URL HERE" border="0"></a>'
ad[5]='<a href="YOUR WEBSITE URL HERE" target="_blank"><img src="YOUR IMAGE URL HERE" border="0"></a>'

function randomorder(targetarray, spacing){

var randomorder=new Array()
var the_one
var z=0
for (i=0;i<targetarray.length;i++)
randomorder[i]=i

while (z<targetarray.length){
the_one=Math.floor(Math.random()*targetarray.length)
if (targetarray[the_one]!="_selected!"){
document.write(targetarray[the_one]+spacing)
targetarray[the_one]="_selected!"
z++
}
}
}

</script>

<script language="Javascript" type="text/javascript" ></script>
<script>
randomorder(ad, ' ')
</script>

Step #3: Now, you just need to add your Image URLs and Website URLs. (If you need to know where to get your image URL, I have a post here that explains Hosting Images)

If you need to display more or less advertisements, then copy the the Ad[#]…….</a>’ Section and repeat the pattern, or delete the same section(s) leaving as many ads as you need.  Make sure that if you add additional ads, that you change the # in the [ ]s to be the next number.

IMPORTANT: The code needs to be exact, if it is not working correctly, check and recheck the code and make sure that no quote marks are missing, etc.

Pin It