Devin,

Thank you for your help. I have one more question and problem.

1. I actually had to do this. If I only used 2 entires then I end up with a weird distortion in my Apple icon. So I added the last line from the previous code. To result as this:

#top .social_bookmarks_tumblr a {

background: url(.......uploads/custom/apple.png) no-repeat center;

}



#top .social_bookmarks_tumblr a:hover {

color:#fff;

background: url(........uploads/custom/apple-hover.png) no-repeat center;

}



#top .social_bookmarks_tumblr a {

text-indent: -9999px;

}

2. I now have a retina resolution problem. When I view this on an iPhone 5 and my Macbook Pro Retina the apple icon is pixilated. Any ideas for a quick fix for this. If I do it as 64px x 64px then it looks to large. I imagine I have to add something to the CSS to constrain the proportion then upload the 64 x 64 images. Will you help me with that?

3. Would you mind going back through and deleting my personal links from this post. I abbreviated them above. Could you go back and abbreviate the others please?

Thank you again for your help!

Devin, small problem:

1. I added Ismael’s code at the end of the custom.css

2. I put apple.png and apple-hover.png in—-removed—-

3. Problem: When I hover the apple icon shifts in the hover state. I specifically LOCKED the layers in Photoshop. The normal state apple icon and the hover state apple icon are exactly in the same place pixel for pixel. Do you have any idea why this is happening?

See here > —removed—-

The entire css is as follows:

/* Have fun adding your style here :) - PS: At all times this file should contain a comment or a rule, otherwise opera might act buggy :( */



/* General Custom CSS */



/*

Desktop Styles

================================================== */

/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */



@media only screen and (min-width: 768px) {

/* Add your Desktop Styles here */



}



/*

Mobile Styles

================================================== */

/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */



@media only screen and (max-width: 767px) {

/* Add your Mobile Styles here */



}



#top .social_bookmarks_tumblr {

background: url(...wp-content/uploads/apple.png) no-repeat center;

}



#top .social_bookmarks_tumblr:hover a {

color:#fff;

background: url(....wp-content/uploads/apple-hover.png) no-repeat center;

}



#top .social_bookmarks_tumblr a {

text-indent: -9999px;

}

Hellooo Nick,

I was on one path then you sent me something different. I appreciate it. But can you explain how this plugin is used to solve my specific problem as stated above?

Thank you

Ok I’m going to recreate this as a PNG in photoshop.

Am I understanding this correctly?

– color background = 30px x 30px

– color stroke = 2px

– total icon dimensions 32px x 32px

– icon height = 17px

Is this correct? Also I see a 1px dimension (border width & text shadow) as well. What is that? I imagine the border shadow is a 1px drop shadow??

Thank you for your time.

Hi Devin, Ismael, Dude,

Devin’s last response confused me a bit because it was a bit general in nature. I am very close to understanding this. Let me restate. I’ll be very clear. Currently, I have a tumblr icon linked to my apple certification site with a blue background.

This is exactly what I want, no more no less:

1. Normal State: grey apple icon on enfold white? background.

2. Hover State: white apple icon on dark grey background.

Am I correct in understanding that I do this?:

1. Normal State: In Photoshop, create a 64px x 64px SQUARE png file (grey apple on an enfold white background)

2. Hover State: In Photoshop, create a 64px x 64px SQUARE png file (white apple on an enfold dark grey background)

Is this the specific and correct procedure for what I want? Is the enfold background perfectly white? FFFFFF?

Also, will 64px x 64px be enough to make this retina resolution?

Thank you for your time

Yes I want the author image to show on the author page.

I do not want the author image to show on the blog posts.

I want the blog posts to look exactly like a one author page.

So to accomplish this I do the following?:

1. Go to Enfold > General Settings > Blog Style > Select “Multi Author”

2. Add this code to the end of custom.css

.rounded-container > img {

display: none;

}

Correct?

To restate that last part:

Are these the full directions?

Don’t I need 2 icons? One for normal and one for hover? (apple.png and apple-hover.png)

Wouldn’t that change the second part of the code in the header.php? What would those code changes be?

Also, I want the square background to be black on hover not the Tumblr color background. What would the additional code changes be?

Thank you for your time,

Jasmer

It appears to me that Enfold > Styling is a global change for the entire site. The Landing page that was included with the dummy data, had sections of the page that had dark backgrounds and other sections that had light backgrounds. I’m sure the styling on that particular dummy page was different.

Thank you

Devin,

Thank you. That worked but then it changes the format all other pages. From “My Site Name | Home” to “My Site Name – Home My Site Name”.

So solve this you have to:

1. Go into the Yoast SEO Settings and select “General” then select Force rewrite titles. This is when it changes the format of all other page titles.

2. Go into the Yoast SEO Settings and select “Titles & Metas” then go to the “Posts” tab and make this edit:

In EVERY “title template:” field enter %%sitename%% | %%title%%

That changes it back to Enfold’s template page title format.

Thanks for the point in the right direction! Jasmer

Thanks Dude ;)

Unfortunately that does not work. I think this is what happened:

1. He DOES NOT have the theme page I am looking for here http://kriesi.at/themes/enfold/

2. I believe he changed the http://www.mywebsite.com/pages/landing-page and then did not update on http://kriesi.at/themes/enfold/

3. So I am looking for the Landing Page that came with the theme when I purchased it a week ago. It is not on his theme demo right now so I believe you would have to get it from the theme package that I downloaded.

Page description: The page alternated with dark and light as you scrolled down.

Thank you for your time