Clone Africa YORGOO Media

Configure Atahualpa like Africa YORGOO Media?

Africa YORGOO Media is a customized YORGOO Media Blog based on the Atahualpa Theme. The Atahualpa on YORGOO Media is modified to work with Semiomantics tuning files. This post shows the customization applied to the theme to get the look of Africa YORGOO Media.

The below tutorial can be downloaded as PDF file HERE.

Load the Atahualpa Theme

First things first: from Appearance in your Dashboard Menu select and load Atahualpa. The theme is flexible and allows customization of most any area of the theme. It’s ideal for beginners who don’t want to bother with style sheet editing and on a WordPress MU installation, where you don’t have access to FTP, you are able to load images to customize your theme such as a favicon, a logo and header images.

Atahualpa Theme Options

Now you find under appearance a new tab, Atahualpa Theme Options, select it. The Option page opens a menu with 26 tabs leading to specific customization sections. I will not discuss them all as the theme can be configured to create thousands different looks; I will just show, what settings I used for the Africa YORGOO Media customization. My basic criteria are the color scheme of YORGOO which is Black, Gray and Red. I use basically the following color codes:

Black: 000000

Dark Gray: 333333

Medium Gray: 666666

Red: B30000

To make it simple, I stay within these colors for all areas of concern.

I will just indicate the tabs selected and the corresponding modifications.

Atahualpa Body, Text & Links

Atahualpa Body Text Links

Atahualpa Body Text Links

My link color is close the the black color of the text fonts, here dark gray. The Link Hover (shows when you pass the cursor over a hyperlinked word or expression) color is obviously my standard red.

Note: I don’t underline links, nor edit them in bold fonts.

Atahualpa Layout

Here is my selection for the layout; I like flexible width (fluid), and I define minimum and maximum width.

Atahualpa Layout

Atahualpa Layout

Atahualpa Favicon

Obviously I want to load my own favicon called y-favicon.ico. You may use it as well by using the below settings. If you wish to use your personal favicon, we will load it for you, just send it to yorGOhelp in the correct format as indicated on the Atahualpa Favicon page.

Atahualpa Favicon

Atahualpa Favicon

Atahualpa Header

Header Logo

I just use the default YORGOO Media Logo, a privilege when your name starts with a Y :-). You can load your own logo following the instructions on the menu: open an existing post and upload your logo without inserting it into the post. The logo file can be a .jpg, .gif, .png, .bmp format. Just enter the name of the file into the Logo field. My logo is 56×56 px gif; if you want to use the YORGOO Media logo, just leave the entry as is: logo.gif.

Atahualpa YORGOO Media Logo

Atahualpa YORGOO Media Logo

Atahualpa Header Fonts

As before, I just apply my colors and I print in normal and not in default bold.

Atahualpa Header Fonts

Atahualpa Header Fonts

Header Styling

Note, I don’t like dashed lines, so either I remove these lines or I print them solid. To make a dashed line solid, just replace the word ‘dashed’ by ‘solid’ in the style sheet entry. To make it disappear, either remove the whole line or set the with of the line to 0px (zero pixels).

In the Search Box field, I put the border weight to 0 pixels, the horizontal bars I print ‘solid’ whereas the first bar with a weight of 2 px and the second thinner with 1 px.

Atahualpa Header Styling

Atahualpa Header Styling

Atahualpa Header Images

I have created 8 header pictures in the format 1200×150 (corresponding to the max with allowed under the Layout definition). The pictures are named:

atahualpa_header_1.jpg

atahualpa_header_2.jpg

atahualpa_header_8.jpg

atahualpa_header_1

atahualpa_header_1

atahualpa_header_2

atahualpa_header_2

atahualpa_header_3

atahualpa_header_3

atahualpa_header_4

atahualpa_header_4

atahualpa_header_5

atahualpa_header_5

atahualpa_header_6

atahualpa_header_6

atahualpa_header_7

atahualpa_header_7

atahualpa_header_8

atahualpa_header_8

To upload the images, just open an existing post and load them using the same file names as indicated and don’t insert the images into the post. You may load as many as you want, just change the number in the image name accordingly.

If you load only one picture, then you are all set. If you load multiple pictures, then configure the rotation. My settings are to rotate the pictures in an interval of 10 seconds.

Atahualpa Header Rotator

Atahualpa Header Rotator

I don’t want to preload the 8 pictures as it would slow down the loading time of the first page visited. Clicking on the header will lead visitors back to the home page.

Opacity

I use the default white opacity 40% and on a width corresponding to the width of the sidebars on full width.

Atahualpa Header Opacity

Atahualpa Header Opacity

Atahualpa Header Opacity Right

Atahualpa Header Opacity Right

Atahualpa Page Menu Bar

Most is default, I just delete borders and adapt the colors:

Atahualpa Page Menu Bar

Atahualpa Page Menu Bar

Atahualpa Category Menu Bar

Just adapt color.

Atahualpa Category Menu Bar

Atahualpa Category Menu Bar

Atahualpa Next/Previous Navigation

I select in the first field to display the previous to the right and next to the left. Then I just modify at the bottom the styles by drawing ‘solid’ lines and modifying the color of the lines to my color B3000.

Atahualpa Next/Previous

Atahualpa Next/Previous Navigation

Atahualpa Sidebars

Here are my width settings for the sidebars as well as the style modifications:

Atahualpa Sidebars

Atahualpa Sidebars

Atahualpa Sidebars Style

Atahualpa Sidebars Style

Atahualpa Widgets

Just adjust colors as per screen shot. Click on the image to see the original size of the table.

Atahualpa Widgets

Atahualpa Widgets

Atahualpa Footer

Just change the border to solid and 2 px as well as adapt the color:

Atahualpa Footer

Atahualpa Footer

Then add your Copyright notice:

Atahualpa Copyright

Atahualpa Copyright

Atahualpa for Africa YORGOO Media

The Atahualpa Theme is flexible and can be adapted to needs easily. Once you know what kinds of styles you like, you just focus on the few modifications needed to customize accordingly. There is a lot more you could modify as you can see from the Options Menu; however the default settings are quite fine on many of these features. My goal was to quickly have a user friendly site up and running and then move to the next instead of spending hours on the ultimate golden cut.

May this tutorial help.

  4 comments for “Clone Africa YORGOO Media

  1. May 17, 2009 at 11:06 pm
  2. May 17, 2009 at 4:07 pm

    Thank you for these instructions! As I followed the recordings yesterday I noticed little gremlins interfered and interrupted them as of the SIDEBARS. So this will help us to complete the task at hand and learn from it.

    Submerging from the storms and rains… and heading for the next dive – there’s nothing like forced hibernation in Africa!

Leave a Reply

Your email address will not be published. Required fields are marked *