Jump to content
Sign in to follow this  
sladeh

Customizing iBlog Pro 3

Recommended Posts

sladeh    0
sladeh

I am trying to customize the iBlog Pro theme for a company which has purchased this theme to use. I am wanting to add a few things such as a "quick search" on top of the navbar and below the header, shift the twitter and social networks to the top left corner, and add drop down to the navigation bar as well. Here is a mock up I had created in photoshop: PHSqDl.jpg Right now, I'm having difficulties with the feature footer and changing the colors. There is a white bar that is above and below the color change. I could not seem to find which image is being used to create the border for the feature post. Here is what I'm talking about specifically: ebQWS.png Any ideas or assistance would be excellent. Thank you!

Share this post


Link to post
Share on other sites
sladeh    0
sladeh

Okay well I figured out the footer ordeal. Now I'm wondering if it is possible to move the social network links over to the left? And move the twitter below them as in the photoshop mock up?

Share this post


Link to post
Share on other sites
justme    0
justme

I know just enough CSS to be dangerous, so no warranties here. In style.css, I see:

.nav-icon {float: right;margin:13px 0 0 8px;}
I would guess you want to change the right to left - you may or may not want to play with the margins. In the same file you find the twitter code:
#feature-footer .twitter {float: right;margin-right: 16px;display: inline;color: #777;}
		#feature-footer .twitter a{color: #333;}
Again, I would change the float to left. Now, to actually move it to the top of the page, you would need to find and move that code. In includes/pro/template_feature.php,line 33, I see
<?php include (LIB . '/_twittermessages.php'); ?>

I would try moving that to header.php. Hopefully this is not completely off base. Andrew, if I am all wet just let me know and I will be properly chastised. :) Good luck.

Share this post


Link to post
Share on other sites
Jackey    29
Jackey

I'm afraid those nice rounded corners only show in Firefox and Safari and not in IE. I suspect the lines and corners are rendered at the client side.

Share this post


Link to post
Share on other sites
sladeh    0
sladeh

Thanks for the advice everyone! I had managed to get the social links to the left, and I fixed the footer. It was the image file post-bg-short.png that needed altering. Justme, thanks for the code bits. I've been finding it difficult to find where stuff is located at and firebug isn't helping too much lol. I'll tinker around with that!

Share this post


Link to post
Share on other sites
sladeh    0
sladeh

Figured out had to create a new div in the header.php under line 108 (from the closing div)

<?php include (LIB.'/_iconlinks.php'); ?>
	</div>
So I created 4 new lines with the following code:
<div>
		<?php include (LIB . '/_twittermessages.php'); ?>
	
				</div>

I put the break in there to push it away from the navbar, or else it was sitting right on top of it. To note, after shifting the social network icons to the left and removing the header text, you must put in a bumper image or graphic to push the header down or else it chops off the icons.

Share this post


Link to post
Share on other sites
Andrew    201
Andrew

Thanks for the report, I'm sure that will help people a lot

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×