Jump to content
Sign in to follow this  
winprogger

Styling an IFrame

Recommended Posts

winprogger

I am trying to integrate adsense for search into platformpro. I have gotten it to work by following the instructions @ http://brianwong.com/blog/how-to-add-customized-adsense-for-search-wordpress/ However I am not able to style the search results area to match the rest of the pages. I have tried to add custom css rule for the div that is parent of the iframe and no joy. I suspect this is because google is using an iframe whose style is overriding everything that I put in custom CSS for platformpro. How do I do this ?

Share this post


Link to post
Share on other sites
winprogger

Kate, This is on localhost and not on live yet. I have uploaded the html page I see when i get the search results and a snapshot of the page so you have an idea what I am talking about. The static page has the following google code in it -

<div id="cse-search-results"></div>
	<script type="text/javascript">
	  var googleSearchIframeName = "cse-search-results";
	  var googleSearchFormName = "cse-search-box";
	  var googleSearchFrameWidth = 500;
	  var googleSearchDomain = "www.google.com";
	  var googleSearchPath = "/cse";
	</script>
	<script type="text/javascript" src="http://www.google.com/afsonline/show_afs_search.js"></script>
	

Share this post


Link to post
Share on other sites
cmunns

You can override inline CSS styles by adding the `!important` tag just before the semi-colon of any CSS rule.

Share this post


Link to post
Share on other sites
winprogger

I tried the following fragments and in each case it did not work

#cse-search-results{
	font-family:Georgia,'Times New Roman',Times,serif !important;
	}
.l {
	font-family:Georgia,'Times New Roman',Times,serif !important;
	}

(l is the class for links in the main search results)

Share this post


Link to post
Share on other sites
catrina

Try adding the code to the base.css file in Platform Base to see if that makes a difference.


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
winprogger

I tried that - didn't help. Any other ideas ?

Share this post


Link to post
Share on other sites
Kate

@Satya If there are styles being generated by Google, can you view them (via a view source, perhaps)? The CSS declarations that you're writing would be more targeted if they're the same as those being generated. For instance, say you're referring to the ".l" class in your CSS, but Google is referencing "#page .l". In that case, being more specific in your CSS may help. Hard to say without seeing the code.

Share this post


Link to post
Share on other sites
winprogger

I have modified live site to show you the problem. Please use the search box on top right to search any word (I suggest "kernel") and you will see how the page renders.

Share this post


Link to post
Share on other sites
bryan-hadaway

This needs to be styled from your AdSense account. There's an editor there to pick and choose your colors. Thanks, Bryan

Share this post


Link to post
Share on other sites
winprogger

Unless I am missing something, there is no font customization available unless one does "custom search engine" where the search box is part of the page which is not the case here [some code in search box, the rest in a page]. How do i change the page font ?

Share this post


Link to post
Share on other sites
catrina

Hmmm, I know of a WordPress blog that uses custom search engine and she is able to customize the font to match her site, so you are right on that.


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

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  

×