Lately I have had several clients that have wanted to add items to their WordPress websites, but didn’t exactly know what words to use to tell me that is what they wanted. I have compiled a vocabulary list to help “decode” some of these puzzling terms. Take some notes, share, and enjoy.

#1 Favicon

Dictionary definition: A favicon or Favorites Icon is a small graphic that is associated with a page or Web site. The favicon allows the Web developer to customize the site in the Web browser, both in the tab bar that is displayed in many browsers as well as in the bookmarks when a site is saved.

Similar Phoenix SEO,Web Design Phoenix and WordPress Designer Tips:

1. Submitting Your Thesis WordPress Site, Sitemap, and Setting up Analytics for Google. It is super important that you don’t forget to submit...
2. WordPress Designer Tutorial for Moving a WordPress Site to a New Domain and Host I have been meaning to add this post for quite...

I rarely write personal blog posts. Most blog posts are all tutorials, but I thought I’d address the elephant in the room…me! Yes, it is true I got a facelift. No, not physically silly, I am only 28. Let me clarify. Rachaelbutts.com got a facelift. It was a long time coming. We are so busy around here making WordPress websites to work on our own, but it just had to happen! Rachaelbutts.com is 7 in .com years and 2 in design, so that is like what, 150 in in total website years!?

It all started with an idea from my mom. We were talking about the fact I need to update my design and she sent me this pic as inspiration. She thought the idea of not actually showing my whole face would make it not so much about me, and more about “us” and what we do…making WordPress websites.

I thought well I do have really tall ceilings and I could have my fiance take a pic of me from the top of the stairs and I could Photoshop the rest, but I thought I really need to take it to the next level. I started on my hunt for a professional photographer in Phoenix, and I posted an ad on craigslist. I got a flood of response. Some really sucked, some were creepy and then I found one just right. Josie Bryant of JosieKProductions replied to my ad and I explained my vision for the project. I told her I needed someone to shoot me at an imaginary desk with a couple desk items, and the rest would be Photoshopped in. I also explained that is was really important that we get the angles just right or it wouldn’t translate. Plus, we needed to shoot multiple items separately at the same angle so we can place them all together in one image. She said she has a studio, we could shoot on a white background, and that she had a a ladder and could make it work. I was thrilled to say the least.  I made an appointment for the following week, and gathered all the items I wanted pics of.

Here are the pics we used to create the images on our new site.

I had to sit on this teeny tiny stool, and use a prop desk to get the effect of putting my feet up

This is the actual lamp on my desk, and my engagement pics of Ryan and I

This is the hardest working member of my team, my laptop

My skateboard. Yes, I really do skateboard. If you want to see my scars from surgery pm me.

My best gal Foxy and her little owl toy. I have a thing for owls, and I make her like them. I hear no objections.

Top view of Foxy to get that birdseye effect.

What? You were expecting more? This is where the next part comes into play. I am pretty handy with Photoshop, but to get that digital illustrative feel I needed to hire an Illustrator. For this part I ran a contest on Freelancer.com for the header of the website. Their contests are super cool. You pay a fee, place an ad for what you are wanting to accomplish, and upload your files. In this case I uploaded my inspiration pic, all the images from the photoshoot, and where I wanted what on the image. I had 25 entries, but my favorite was a fellow named Harry Martawijaya . During the contest people submit their entries, and then you can leave them feedback. I only needed to have Harry revise a few things, and then I selected him as the winner.

Here is was his final image using my pics he added the desk, chair, mouse pad,and rug.

I loved what he created, but I needed a footer. I contacted him outside of the contest and sent him my details for my idea for the footer. I explained I wanted Foxy my cutie pie papillon puppy on a chair ( I sent him an example of one I wanted) and that I wanted a dog bowl and some biscuits along with her favorite toy the pink owl. He said he could do it no problem.

 This is what he came up with for the footer.

So, that is the story of how we changed the look of Rachaelbutts.com. It was really fun to see the idea come to life one step at a time.

Similar Phoenix SEO,Web Design Phoenix and WordPress Designer Tips:

1. RachaelButts.com is hiring WordPress designers/developers We’ve been in the business of creating custom designed web...

We want to hear from you. We want to know what tutorials you would like to us create regarding anything WordPress. Anything from beginner to advanced. We want to hear it all. Once we select the tutorials that we will be creating we will contact you, and feature you on our site with a notable mention in the tutorial.

Similar Phoenix SEO,Web Design Phoenix and WordPress Designer Tips:

1. Phoenix SEO Rachael Butts Link Building Tutorial Step 12 | Social Media Social Media for SEO can sometimes become overwhelming. Trust me...
2. WordPress and SEO Go Together Like Peas and Carrots I get about 1 inquiry about someone wanting to know...
3. WordPress Designer Tutorial for Moving a WordPress Site to a New Domain and Host I have been meaning to add this post for quite...

We’ve been in the business of creating custom designed web sites since 2009 and we are looking to expand our team by one (possibly two) remote, full-time to part-time designers/developers. If you are interested in building custom web sites and making a decent income from doing so – this opportunity may be of great interest to you! Our projects will challenge you and if you’re up for it – then we’re up for talking with you!

Here’s the down and dirty:
Minimum Requirements:

Documented experience in graphic design and web development
Experience with WordPress is a must
HTML/CSS knowledge is a must
Good communication skills.
Excellent time management. Ability to work on a deadline
While the number one qualification for this opening is a strong sense of design (aesthetics) along with strong web skills, we’re also looking for individuals with great critical thinking skills, a good work ethic and customer service skills.
We run shop like a consultancy, which means you need to know your stuff- and their stuff (whoever they may be).
Do you have references from folks you’ve worked with in the past on web projects?? I’d LOVE to hear ‘em!
An online portfolio of work or client sites you can point me to so I can see your work in action? (screenshots are nice, but I like to dig a bit more beyond the pretty, ya know)

Types of Projects we’re doing lately:

WordPress web sites, mainly (some with and some without a blog) for small and large business, multisite networks, social communities and lots of social media integration.
WordPress with E-Commerce (Cart66, Shopp or WP E-Commerce experience greatly appreciated!)
WordPress MultiSite (and BuddyPress)
Membership sites with WordPress
(…do you get a feeling that we do a LOT of WordPress sites??? we do!)

Work Environment

Your home because this is remote work – how cool is THAT?
In your pajamas, if you like

We’re looking for someone who

Thinks design is about solving problems, not making them
Likes to have a lot of fun tinkering around inside the guts of a blog
Gets more kicks out of removing elements from a page than adding them
Wants to learn, push themselves, and make the web a better place to be!
Wouldn’t mind making a few extra $$’s doing something they love! How much, you say? Well, why not apply and find out (hint: we ain’t talking about coffee money here!)

If you’re interested – you can apply using this form only (any other method of application will most likely get overlooked – – so don’t try to DM on Twitter or send a message on Facebook — please use this form only.)

I give each application consideration – but please do be patient as I go through all of the applications received. I will read them all and will be contacting you within the next week, or two. Thank you!

Similar Phoenix SEO,Web Design Phoenix and WordPress Designer Tips:

1. Look for launch of Rachaelbutts.com redesign coming early 2012 We have been busy like little elves working on lots...
2. Rachaelbutts.com gets a facelift I rarely write personal blog posts. Most blog posts are...
3. WordPress Vocabulary Lesson Lately I have had several clients that have wanted to...

I have been meaning to add this post for quite a while. I have seen a lot of different tutorials on this issue, but none that were really accurate. They were either in geek speak or just way too generic.

There are a couple different scenarios for moving a WordPress site.

#1 Moving a site on the same domain or folder

#2 Moving a site on the same host with the same domain name or different domain name

#3 Moving a site from another host and domain name ( this is the one we will be going over today)

Reasons why you need to move a site from a different host and domain name

a. Your site is incredibly slow and you think your new host will help

b. You decided to change identities and need to move your site to a new domain name

c. You built your new site/theme on a test domain area and need to upload it to the live site. ( I do this when creating clients websites)

Click Here to watch the video tutorial of the steps below

Step 1

Login to your FTP client *You will need to use a 3rd party FTP client like Filezilla, since most hosting panels don’t allow for downloading folders

Download your WordPress files to your local hardrive *I normally can get away with just downloading the following: theme, plugins, htaccess ( if you have one) , uploads, and if you have images and extra css folders outside of wp-content copy that too. Please also note if you are wanting to bring over everything then you can download and upload everything but if you are just move your design, pages, images, and plugins which is 99% of what you will ever need to move a whole WordPress website.

Login to your old WordPress site and click “tools” “export” and download your pages and posts

Step 2

Login to your host.

Go to php MyAdmin under “databases”

Find the database associated with the site you are wanting to move.

If you have a lot click on one of the databases and click wp_options and look at the sitename. This will tell you the website you are exporting. Make sure you click back on the database name to download the whole database.

Click “export”

Under “tables” click “add drop tables”

Click “go” and it will ask you where to save it * I normally put a folder on my desktop with the WP files I downloaded along with the mysql database

Step 3

Log into your new host

Go to phpMyAdmin ( assuming you already have installed WordPress on your new host, you can do a regular WP install )

Go find the database associated with you new WordPress install.

Click import

Upload the mysql database you you downloaded

Click “structure” “wp_options” and change the site url to the new site url *your username and password will be your old username and password, if you would like a new one you can change it in the dashboard of your WordPress site or you can go to wp_users and change it there.

Step 4

Login to your ftp for your new site and upload the files that you downloaded from your old site

Step 5

Login to your new WordPress site

Go to “settings”

Click “general”

Where is says “site name” is will say your old url so change it to the new one.

Step 6

Go to themes and activate the theme you were using

Go to “tools” “import” and import the file your old WordPress site gave you

Go to plugins and activate the plugins you were using *sometimes you will have to go in and place the settings you had previously for your old plugins so you can take a screen shot or write down the settings you had

Go to your widgets and place back in the widgets you had *sometimes you will have to go in and place the settings you had previously for your old widgets so you can take a screen shot or write down the settings you had

That’s it! Sometimes you need to poke around and see if you made internal links in the pages and you will need to change those, as well as images.

You can use the plugin Search and Replace to find the links for your embedded images.

Best wishes!!

Similar Phoenix SEO,Web Design Phoenix and WordPress Designer Tips:

1. 5 SEO Factors When Choosing a Domain Name. What better place to pick up where we left off...
2. WordPress Designer Tip #2 How to Add a Facebook Like Box to Your Sidebar Hey guys! WordPress designer Rachael here giving you yet another...
3. WordPress Designer Secrets Revealed- How to add social media icons to sidebar Eat, Pray, WordPress Designer Love…in that order. Maybe add some...

Hey everyone, long time no blog post. I sure have been busy over here making you Thesis WordPress sites, but I thought I’d solve a question I get asked a lot, which is how to manage that teaser section of your Thesis WordPress site.

First off make sure you set up your teaser section under Thesis>Design Options. It is under Default Post Image Settings and Default Thumbnail Settings

Then also set up your teasers how you like them, some people want to only display 2 or 4, personally I like all my posts to be teasers, and to do that you just set your features and teasers under Thesis site options to 0, then they all will be teasers. Then I set the number of features I want to display, and then I correspond that with the number of posts to show under Settings>Reading in the WordPress Dashboard.

Finally I also style my teasers to span across the content area. To do this I add the .css code below to my custom file editor.

.custom .teaser { text-align: justify; }
.custom .teaser {
width: 100%;
margin-top: 2em;
padding-top: 2em;
border-top: 1px dotted #bbb;
text-align: justify;
}
.custom .teasers_box {
padding-top: 0;
padding-bottom:0;
border-top: 0;
}

Enjoy the video! and Check out my other WordPress Designer Tutorials.

Similar Phoenix SEO,Web Design Phoenix and WordPress Designer Tips:

1. Remove tiny space between header and navigation in Thesis So it took me probably 3 whole weeks to figure...
2. WordPress Designer Tip #2 How to Add a Facebook Like Box to Your Sidebar Hey guys! WordPress designer Rachael here giving you yet another...
3. How to add Cool Floating Social Icons to Thesis WordPress Website In this tutorial I am going to show you how...

Hey guys! WordPress designer Rachael here giving you yet another tip for your WordPress website. This time it is how to add a Facebook Likebox to your WordPress sidebar, but really you can place the code anywhere in your .html tab, or code it in if you like.

So watch the video below and the steps are at the bottom

Step One: Log into existing ( or create one) facebook account
Step Two: Create FanPage by click on in your profile area ( main page of your Facebook) on “Add a Page”
Step Three: Add Like Box by going to FanPage, and before you click add likebox, copy the whole URL of your fanpage
Step Four: Click Add Like Box
Step Five: Paste URL over the existing link in link url window
Step Six: Set Desired setting
Step Seven: Login to your WordPress site
Step Eight: Go to Appearance> Widgets
Step Nine: Grab a Text widget and drag it to the column you would like it in
Step Ten: Paste it into the widget, save, you are all done!

That is it for WordPress Designer Tip #2 How to Add a Facebook Like Box to Your Sidebar!
XOXO, Rachael

Similar Phoenix SEO,Web Design Phoenix and WordPress Designer Tips:

1. WordPress Designer Secrets Revealed- How to add social media icons to sidebar Eat, Pray, WordPress Designer Love…in that order. Maybe add some...
2. WordPress Designer Tutorial for Moving a WordPress Site to a New Domain and Host I have been meaning to add this post for quite...
3. WordPress Designer Tip #3 How to Add Pics to Your Thesis Teasers Section Hey everyone, long time no blog post. I sure have...

Eat, Pray, WordPress Designer Love…in that order. Maybe add some desk calisthenics in there. No, but seriously I wanna talk to you today about some of my secrets I use as a WordPress designer, and how I go about doing some of the little things I do. Sometimes I forget the simple things people want to do to their WordPress site, so hi ho cheerio let’s go.

#1 Adding social icons to your sidebar
Go download some social icons, 2 places I use: Iconsmysitemyway, and Iconspedia. *Tip: when downloading your icons, it is best to go ahead and download the size you are wanting to use, and download all in the same size so it saves you some time.

#2 Go to your WordPress dashboard, and go to the Media tab on the left, and select Add New.

#3 Click Select Files

#4 Browse your computers file and select the icons *Tip: To add more than 1 social icons at once make sure all icons are in the folder and hold shift+click icon and you can select more than one at once

#5 Click Show

#6 Copy File url

#7 Go to Appearance>Widgets *Tip: press Control+click to open this in a new tab so you still have those other file urls open in a separate tab

#8 In Widgets, select a text widget, drag and drop it into the sidebar

#9 Add the .html <a href=”http://yourlinklocation.com”><img src=”filerul”></a> *Tip: the href is where you want your social icon to link to and the img src is the path you just copied so you can paste it in there

#10 Save it, and go view your sidebar

#11 Rinse, wash, repeat and add each social icon, one right after another in your sidebar, and it will appear right next to one another. Like so: <a href=”http://yourlinklocation.com”><img src=”filerul”></a> <a href=”http://yourlinklocation.com”><img src=”filerul”></a> <a href=”http://yourlinklocation.com”><img src=”filerul”></a>

#12 This also applyies to ANY image you would like to appear in your sidebar, if you don’t want it linked just don’t use the ahref,

Thanks for joining me in my WordPress Designer Secrets Revealed- How to add social media icons to sidebar

Similar Phoenix SEO,Web Design Phoenix and WordPress Designer Tips:

1. WordPress Designer Tip #2 How to Add a Facebook Like Box to Your Sidebar Hey guys! WordPress designer Rachael here giving you yet another...
2. How to add Cool Floating Social Icons to Thesis WordPress Website In this tutorial I am going to show you how...
3. WordPress Designer Tip #3 How to Add Pics to Your Thesis Teasers Section Hey everyone, long time no blog post. I sure have...

In this tutorial I am going to show you how to add cool floating social icons to your Thesis 1.7 site for WordPress.

I used Trasy’s site as my example. Below is the video, and below the video is the code to copy and paste into your custom_functions and custom_css.

Copy and paste this code for the cool floating social icons into your Custom Functions ( the pink is where you should type in your own information:

/* SAVE THIS IN CUSTOM_FUNCTIONS.PHP FILE */ add_action('thesis_hook_before_header', 'sitewide_feedback_buttons'); /**************************************************************************/ /* FLOATING SOCIAL PROFILES ON SIDE OF SITE */ /***************************************************************************/ function sitewide_feedback_buttons() { ?>
    <div id="feedback">
        <a href="http://www.twitter.com/yourusername" id="twitter" target="_blank" title="Follow @twitterid on Twitter">Follow @yourtwitterid on Twitter</a>
        <a href="http://www.facebook.com/yourusername" id="rss" target="_blank" title="Check out Your Name Facebook Page">Check out Your Name Facebook Page</a>
        <a href="http://www.yourdomain.com/contact" id="email" title="Contact Your Name by Email">Contact Your Name by Email</a>
        <a href="http://www.linkedin.com/yourusername" id="linkin" title="View Your Name LinkedIn Profile" target="_blank">View Your Name LinkedIn Profile</a>
        <a href="http://www.youtube.com/yourusername" id="skype" title="Watch my Videos on YouTube" target="_blank">Watch my Videos on YouTube</a>
    </div>
<?php }

Copy and paste this code for the cool floating social icons into your Custom CSS( the pink is where you type in your own image path)( If you would like to change where the image floats you can change top:10% to top:20% to move it down, you can put any % you want to give it the position you want:

/* SAVE THIS IN CUSTOM.CSS FILE */ .custom #feedback {background: transparent; width: 3.2em; position: fixed; top: 10%; left: 0.55%;} .custom #feedback a {display: block; text-indent: -9999px; height: 3.2em;} .custom #feedback #twitter {background: url('http://www.yourdomain.com/images/yourimage.png')} .custom #feedback #rss {background: url('http://www.yourdomain.com/images/yourimage.png')} .custom #feedback #email {background: url('http://www.yourdomain.com/Blog/wp-content/uploads/2009/08/contact-new.png')} .custom #feedback #linkin {background: url('http://www.yourdomain.com/images/linkedin.png')} .custom #feedback #skype {background: url('http://www.yourdomain.com/images/youtube.png')}

Similar Phoenix SEO,Web Design Phoenix and WordPress Designer Tips:

1. Customize WordPress Thesis Theme with Icons…I’ve gone icon crazy! I was searching around trying to find some really great...
2. WordPress Designer Tip #3 How to Add Pics to Your Thesis Teasers Section Hey everyone, long time no blog post. I sure have...
3. WordPress Designer Secrets Revealed- How to add social media icons to sidebar Eat, Pray, WordPress Designer Love…in that order. Maybe add some...

Welcome to my 2nd tutorial in my new series,”Customizing Thesis Theme for WordPress 102 | Firefox Add-On Tools”.

Firefox add-ons are little mini-programs for your Firefox browser, kind of like plugins for a WordPress website. They help you do all sorts of fabulous things, like inspecting .css and php elements and changing them in the browser before actually coding it into your site. How cool is that!?

The firefox add-ons that I am sharing with you today are:

1. Firebug -The most popular and powerful web development tool

• Inspect HTML and modify style and layout in real-time
• Use the most advanced JavaScript debugger available for any browser
• Accurately analyze network usage and performance
• Extend Firebug and add features to make Firebug even more powerful
• Get the information you need to get it done with Firebug.

2. Colorzilla-Advanced Eyedropper, Color Picker, Palette Viewer and other colorful goodies for your Firefox

3. Measureit-Draw out a ruler to get the pixel width and height of any elements on a webpage.

I tried out the internet explorer tab, but I thought it kind of sucked and was inaccurate :p

Check out the video on me using the 3 tools above that I use for Thesis WordPress design and development.

Similar Phoenix SEO,Web Design Phoenix and WordPress Designer Tips:

1. Customizing Thesis Theme for WordPress 101 | How to upload your custom header. UPDATE this is only for versions of Thesis prior to...
2. Phoenix SEO Link Analysis for Firefox As you follow my 12 Steps to Phoenix SEO Link...
3. WordPress Designer Tip #3 How to Add Pics to Your Thesis Teasers Section Hey everyone, long time no blog post. I sure have...