Jazzing Up Your TpT Quote Box



Today I'm sharing a post for my fellow TpT teacher-authors. 

If you're a TpT seller, then you know all about the area on each of our stores' pages for a quote.  Sometimes people include links to their blogs or other promotional messages in that space.  Well, last night I gave my quote the boot!  That's right, after I saw some sellers with updated quote boxes, I knew that I wanted to jazz up my store as well.


So, I read a few tutorials.  I tried.  I failed.  I tried.  I failed.  Then, I called my friend for help.  She pointed me in the right direction....and with her help, my TpT store now looks like this:

As an interesting side note, my old store quote was from Leonardo Da Vinci and it said, "The knowledge of all things is possible."  So, last night as I was growling at my computer when I couldn't get my new jazzy quote box to format correctly on TpT, I tried to remind myself of Da Vinci's words.  Do you think he was imagining transparent backgrounds and hyperlinks when he first shared his wisdom?

So...are you ready to jazz up your own quote box?  

1.  Open PowerPoint, click on the 'Design' tab, select 'Slide Size', choose 'Custom Size' and resize the slide to 3 in. wide by 1 in. high.


2.  Design your quote box.  You'll be making this quote box "clickable" so you might want to add a message that corresponds with one of your custom categories.  For instance, if you have a Test Prep category, you might design a quote box with a "Don't Forget to Check Out These Test Prep Resources" message.  Also, make sure that all the text boxes you add stay within the 3 x 1in slide.


3.  Make a transparent background.  Click the 'Insert' tab.  Select 'Shapes.'  Select the square shape option and draw a square/rectangle over the top of your entire slide.  


Then "right click" your mouse while hovering over the rectangle shape you just inserted.  Select 'Format Shape.'  You'll see design options for the shape's fill to the right of your slide.  


Select 'Solid Fill'  Then, slide the transparency over to 100%.  (You'll see your design again.)  See that outline of your shape?  You'll want to get rid of that by selecting 'No Line' under the format shape options.  

Finally, right click on your quote box again, and select 'Send to the back.'  Now you have a transparent background.


4.  Save your quote box design as a picture.  Press CTRL A to highlight every element of your quote box.  Then, "right click" your mouse and select 'Save as a picture.'  Save this picture to your desktop and give it a File name before clicking 'Save.'

(Here's a tip from Ainsley Karl when you 'Save as a picture' click on 'options' and enter in - 452.)

5.  Host your quote box picture somewhere.  I used Photobucket.  I just dragged the quote box image that I saved on my desktop to upload it to Photobucket.  Then, I copied the direct link that Photobucket created.


6.  Prepare your links for the TpT quote box.  Remember, the TpT quote box will have an image and a clickable link.  Therefore, you need two links.  One is for the quote box image you designed.  You know, the link you just copied from Photobucket (or other hosting spot).  Open a blank document and paste that link under the title 'Photo Link.'  Then, figure out where you will be sending buyers when they click on your quote box (perhaps to a custom category, or to your blog, or to your freebies).  Open that page and copy the link.  Paste that link under the title 'TpT Link' on your opened document.


7.  Shorten your links.  In order to not exceed TpT's quote character limitations, both links need to be shortened.  Go to bitly.com.  Paste the photobucket link into the upper right-hand box on the webpage and click 'Shorten'.  Copy this new short link and paste it on your document under 'Shortened Photo Link.'  Repeat this process with the TpT page link.

8.  Prepare the code for your TpT quote.  Copy this code on your document (where you've been copying and pasting the long and shortened links).

<a href="CLICKABLE LINK"><img src="LINK TO THE QUOTE BOX IMAGE"></a>

Now, insert your shortened TpT page link where it says "clickable link" (delete the words - clickable link).  Then, insert your shortened Photobucket link where it says "link to the quote box image" (delete the words - "link to the quote box image").  Select and copy the code.


9.  Update your quote box on TpT.  Sign into your TpT account and go to your Dashboard.  Right next to the "profile 100% complete," you'll see a green 'Edit Profile' link.  Click that.  Then, where it says personal quote, paste the code.  Scroll down and click 'Save.'



10.  Revel in your awesomeness!  Go check out your store and see your new look.  Awesome, right?



Thanks to Literary Sherri, Crayonbox Learning and What I Have Learned for inspiring and teaching me!


Thanks for stopping by,

43 comments:

  1. Love your new quote banner! :)

    Literary Sherri
    Literary Sherri

    ReplyDelete
  2. Thank you for this detailed explanation! You're the BEST!
    :)

    ReplyDelete
  3. Hi! I followed this great tutorial and it worked, however my box is all misshapen.. I'm not sure how TPT allows it but its outside the "lines" (not sure how else to put it). I love my new banner but it looks a little silly, I would really appreciate your help.

    I double checked that it was 1" by 3" and that was even wider so I changed it and it is currently 1" by 2"
    https://www.teacherspayteachers.com/Store/Ainsley-Karl

    ReplyDelete
  4. So out of frustration I remade the whole file and this time did 1x3 with the transparent background. Saved it in photobucked just like you did. I even logged out of my tpt and searched myself that way- still no luck. Its there and looks awesome just looks about 200% too big!

    Thank you for your assistance :)

    ReplyDelete
  5. This finally got me to understand how to do this! Thank you!

    ReplyDelete
  6. This was SOOO helpful!! Thank you so much!

    ReplyDelete
  7. This is the best tutorial about this that I've read by far. I finally have a transparent background! Thank you!

    ReplyDelete
  8. Thank you so much for the shout out. This is a great tutorial. If you don't mind, I'd like to link it on my Blog. -Danielle -
    Crayonbox Learning

    ReplyDelete
  9. This is the best! I wanted to update with a new photo for back to school and was having the hardest time figuring it out this time. Once I found your tutorial, I got it on the first try! Thanks so much!

    ReplyDelete
  10. Wow! These directions were PERFECT! Thank you so much!!!
    Courtney
    Ramona Recommends
    Ramona Recommends

    ReplyDelete
  11. This was SUPER helpful!!! Thank you SO much! :)

    ReplyDelete
  12. Excellent instructions! Thanks so much

    ReplyDelete
  13. Thank you, thank you! Directions were clear and it worked! I couldn't be happier with the results.

    ReplyDelete
  14. Success! You are fabulous!
    https://www.teacherspayteachers.com/Store/Trifecta-Book-Reviews

    ReplyDelete
  15. Thank you so much! I was hunting all over for how to do this.
    Jessica

    morethanenglish.edublogs.org

    ReplyDelete
  16. Everything worked for me except the transparent background. I followed all the steps and it's still white, even though I tried it over several times to make sure I was doing it correctly. I'm using a Mac but I wouldn't think that would make much difference. Any suggestions?

    ReplyDelete
    Replies
    1. Jessica-
      Did you figure out why your transparent background wasn't working? I'm using a MAC and running into the same issue.
      Lauren

      Delete
  17. Oh no! I'm so bummed to hear that you're struggling to make your background transparent. When I was making my quote box, I was able to set the background as transparent and that totally worked! I'm so sorry that I don't have more insight! MB

    ReplyDelete
  18. Your instructions were great, and my quote box looks good even with a white background. I'll try to figure out what I'm doing wrong. What version of Office were you using and were you using a PC or a Mac? The instructions looked PC-like. Thanks again for all of your help! You can see my "store" because it isn't open yet...

    ReplyDelete
  19. Thanks so much! Great instructions!

    ReplyDelete
  20. Did you use purchased graphics? I wantine to be fabulous too! ;)

    ReplyDelete
  21. Thanks for the directions they are very clear. However my box is off to the side, do you know what I might be doing wrong? https://www.teacherspayteachers.com/Store/Rakovic-Speech-And-Language-Chat

    ReplyDelete
  22. Thank you so much! Super helpful!

    ReplyDelete
  23. I worked on this throughout my day today, and your tutorial was what finally helped me do this successfully. Thanks so much!

    ReplyDelete
  24. Amazing! This was so helpful! Thank you so much!

    ReplyDelete
  25. Thank you SO much! Your directions were very clear and easy to follow. You now have a new follower! :D

    ReplyDelete
  26. Thank you so, so, SO MUCH! Your tutorial helped me out and saved me hours of frustration! :)

    ReplyDelete
  27. You are awesome Mary Beth! Thank you!!

    ReplyDelete
  28. PERFECT!!! Yep, I'm pretty sure you simply ROCK!!! Thanks, you're directions were perfect. I took me four or five tries because my following the directions was...hmm...less than perfect.

    Thanks again!

    ReplyDelete
  29. Ah! Bless you! I have spent countless hours trying to get this right. Your blog post made it perfectly clear. Thank you!

    Jan

    ReplyDelete
  30. Thank you! This was very helpful and you explained how to do it step by step.

    ReplyDelete
  31. I have tried this about 5 billion times with a bunch of other tutorials and never had any luck. Your tutorial was AMAZING!!! I finally got my quote box updated with your help. Thank you a million times!
    Laura

    ReplyDelete
  32. This was so helpful! Thank you so much!

    ReplyDelete
  33. OM Goodness! Thank you so very much. I rebranded my store and lost all my links. I tried about 20 times last weekend to get this straightened out. I am happy to say that thanks to your tutorial it is now working. Wheeee!

    ReplyDelete
  34. This was extremely helpful! Thank you!

    ReplyDelete
  35. You rock! This post was so helpful! I LOVE my new quote box!

    ReplyDelete
  36. My photo link keeps stating that I need to allow third party hosting. I don't know what I'm doing wrong!

    ReplyDelete

Related Posts Plugin for WordPress, Blogger...
Related Posts Plugin for WordPress, Blogger...