SKILLS needed:

- download a file and unzip it

- find and save a pinterest image you like (& have permission to use)

- find and replace text in a text editor (not Microsoft Word)

How to change the default pinterest hover icon

How to change the default icon from this:

into this!

a. Download the zipped file (.zip) => Pinterest Pin It Button For Images

b. Unzip it and open the folder pinterest-pin-it-button-for-images.

c. Create your own pin-it button or search for a free Pinterest Icon on the web.

d. Drag or save your new pinterest image in the open folder: pinterest-pin-it-button-for-images.

e. Open the ppibfi_pinterest.css file in Notepad or any Text Editor and search for the following code below:

.pibfi_pinterest .xc_pin {
width: 80px;
height: 50px;
background-image: url(‘ppibfi_button.png‘);
background-repeat: none;
position: absolute; top: 5px;
margin-left: -1px;
opacity: 0; cursor:
pointer;
display: none; }

f. If your new pinterest image is a different size, change the width and height (red text) above.

g. Change ppibfi_button.png (red text) to the name and file type of your new pinterest image. Save.

h. Compressed the plugin folder again and upload the plugin to your dashboard just like how you normally upload a plugin!

i. Install, Activate and Configure the Plugin Settings.
j. Done!

Props to the plugin authors, Sean, pererinha, vhf

The post Create a Custom Pinterest Button to Hover Over your Images appeared first on WordPress Barista.

“I use Ziplist, but I am realizing that the way it is structured, my recipes are housed in their database, not my blog. If they ever go down, or I don’t want to use them, I lose my recipes.”

Great question!! We called the very responsive people at Ziplist and this was their reply:

Q: When I use ZipList’s plugin or button code, where are the recipes stored?
A: Whether you use the ZipList recipe plugin or you simply add the ZipList button script to your website, your recipes are always stored on your own website. 

[... view your database... insert geeky instructions here ... ]

In short, your website keeps your recipes and ZipList refers all recipe ”view” traffic back to the original partner content.

Q: If the ZipList service were to go down, what would happen to my recipes?
A: The short answer is “nothing”! The display of your recipes on your site has nothing to do with the ZipList service and the only thing that would change is that the ZipList “Save Recipe” button would no longer function.

…If ZipList ever does “go away”, you can simply uncheck the option to show the ZipList button and you will continue to enjoy SEO-friendly display of your recipes without any connection to ZipList.

Thank you Ziplist for your great plugin & customer service!!

The post Q&A: Will I loose all my recipes if Ziplist goes away? appeared first on WordPress Barista.

1. Background Music

Personal preferences, loading times, and the continual re-starting of music on every single page is enough to annoy even the most loyal visitor.

2. Too Big/Small Texts, Unable to read Fonts

Even if your designer has set up fonts that look too big to you – leave them. The fonts are very intentional as well as the sizes. And any designer worth his/her salt has set up the sizes to work in any size of screen.

3. Popups

Enough said?

4. Auto Play Media

Nothing should play automatically – music or video or anything else (?).  It takes time to load and could simply not work on many of your visitors devices (think iphones, smart phones, tablets, etc).

5. Too Many Animations “Moving, Blinking Thingies”

Focus on one item – the goal of the page. Nothing should detract from that. And I’ll give you a hint – it isn’t your header or logo. If something needs to blink or move, it should be THE focus of the page – the single sole, one-and-only focus.

Sources:

http://jwatersdesigns.com/web-design-elements-in-my-opinion-you-should-avoid-having-on-your-site/

http://www.megawebsitebuilders.com/five-bad-web-design-elements-to-avoid/

The post 5 Common Website Elements that Turn Off visitors appeared first on WordPress Barista.

• it is easy to use,
• you can re-order the slides,
• you can control the look without any coding.
• You can control the content as easily as adding a new post.

This tutorial will assume that you have installed Smooth Slider and configured the settings page.

Create a New Slide Show

Navigate to Smooth Slider -> Sliders.

Click “Create New Slider”

Give the slide show a name (post title works well).

Click “Create New”

Create your first slide

Add a new post. This new post will be the first slide in your slide show.

Add the slide title to the post title box.

Add the slide description to the content visual box.

Add the slide image to the Featured Image box.

Scroll down to the Smooth Slider box located below the post content box.

Click “Add this post/page to” and select the new slide show you created in step 1.

In “Slide Link URL” box, paste the link where you would like this slide to take the reader, IF different than this post.

Click Publish.

Create as many slides as you like repeating the above step.

Re-order the slides in your slide show.

Navigate back to Smooth Slider tab -> Sliders -> Your Slide Show.

Click and drag the post names to re-order them.

Click “Save the order”.

Add Slide Show to a Post or Page

Create a new post or page. Or Edit an existing post or page.

Add title, content, featured image, category per usual.

Scroll below content editing box, and click “Display Your Slide Show Name…”

Click Publish.

Tips & Styles

• to create more than one slide show in a post/page, you’ll need to check “Enable Multiple Slider Function on Edit Post/Page” in the settings screen
• to use a background color, be sure that your slider default height is always going to be taller than your tallest slide
• responsive design settings – this will make the slider look nice on phones and other mobile devices. It will only work properly if your theme is set up to be mobile friendly. This does not include a mobile-theme plugin like wptouch.
• to use custom previous/ next links in your slide show, upload your images, and use this code in the “Custom CSS” box:

.smooth_slider .smooth_next{
background: transparent url(http://mywebsite.com/wp-content/uploads/2013/05/next.png) no-repeat 0 0;
width: 84px;
height: 32px;
right: 28px;
top: 8px;
}

.smooth_slider .smooth_prev{
background: transparent url(http://www.autisticglobetrotting.com/wp-content/uploads/2013/05/prev.png) no-repeat 0 0;
width: 84px;
height: 32px;
left: 430px;
top: 8px;
}

You will want to change the width/height left/top measurements to suit your website.

If you have any questions let me know, I’ll be happy to help!

The post How to add slide show with descriptions and navigation appeared first on WordPress Barista.