Apex Code Development You need to sign in to do that
Don't have an account?
gsargucci Simple Sites pages customization
Hi there,
I'd like to customize the look of my Sites VF pages very slightly. Specifically, I'd like to be able to control the background color of the section blocks. I can do this via the 'tabStyle' attribute on either the 'page' or the 'pageBlock' tags, like this:
This works fine when the page is rendered 'inside' SFDC proper, and I can change the look by changing the tab properties of my 'eoSite' custom object tab, but in the Sites context, it just uses the default Sites styles and colors. I've read various articles for customizing look and feel of Sites pages, and know that I can upload a custom stylesheet and take almost total control over that, but that seems like such overkill for what I need to do. I just want to change the silly block background colors! :-)
So:
- Is there a simpler way to change the background color of the 'pageBlock' sections?
- If I'm stuck dealing with CSS, what is the minimum set of styles that I need to 'override' to accomplish the above? (I've looked at the CSS files that are loaded by default, and there are a lot of styles and selectors there... Plus, I'm not a CSS guru, so am hoping to avoid them, if at all possible.)
Thank you all in advance!
Alex
What happens when you disassociate the portal with the site (via the Login Settings tab).
All Answers
Hi gsargucci,
this worked for me:
where testcss_tab is a reference to visualforce tab called testcss. You can create a visualforce tab in the create -> tabs menu at the bottom. You will save on an object in that way.
Hi,
Thank you for your reply. Unfortunately, this still doesn't completely work for me. This is the updated page:
'start_here__tab' is a custom VF tab. As before, the above works correctly when I access the page while logged on to SF, but when I access it via the public site URL, the colors go back to the 'standard' light blue. Does your page work when you access it from a public Site URL? If so, is there anything in my page that jumps at you as incorrect? Is there anything special about your 'testcss' tab and VF page?
Thank you so much for your help,
Alex
Hi,
this is your page on my site: http://sebi-developer-edition.na2.force.com/sebi.
My tab is a simple visualforce tab where I have selected the page I am showing in the site (also selecting another page results in the same colors).
I have chosen the style of the tab as you would do with a normal custom tab and that is the color that show on the site.
I am not sure what you mean by the standard light blue color but I see the same color both from site and from Force.com standard ui.
Hi,
Thanks again for responding. Well, darn it--this is both good and bad news. I see that the page is showing up with different colors for you, but here's my page: http://eo3-developer-edition.na7.force.com/PortalStyle. For me this page is showing up in what I think is the default light blue color for the section names, inistead of the purple that I have assigned to the tab (and the way it's showing up when I go to it from inside SF: https://eo3.na7.visual.force.com/apex/PortalStyle. How is it showing up for you?
I'll try creating a separate, brand new VF page and custom tab to see if that makes any difference. In your experience, the contents of the page referenced in the custom tab (used for 'tabStyle' do not matter, correct?
Thanks!
Alex
Arrgh... No luck. I now have done exactly what you have done (I think...):
- Template page: PortalStyle, published on the site, code like this:
<apex:page showheader="false" sidebar="false">
<apex:sectionHeader title="Portal Style"/>
<apex:pageBlock mode="edit">
<apex:pageBlockSection title="Block Section"/>
</apex:pageBlock>
</apex:page>
- Template, custom VF tab, PortalStyle, using the above PortalStyle VF page, and a bright purple color.
- Test page, PortalStyleTest, using the above tab and page, published on the site, like this:
When I look at it in SFDC, it's purple. When I go through sites, via http://eo3-developer-edition.na7.force.com/PortalStyleTest, it's light blue.
Aaaahhhh! :-) I see that your SFDC instance is different; my NA7 has not been upgraded to Winter '11 yet. I wonder if that has to do with anything. Do you have any other suggestions?
Also, what is the tab setting for the tab that you're referencing? Both in terms of visibility to the 'Guest' profile and in terms of its inclusion in any custom apps exposed in the site?
Thank you very much...
Alex
What happens when you disassociate the portal with the site (via the Login Settings tab).
That made it show up using the specified tab colors. Wow. Great call...
After confirming that that's what's going on, I reenabled the login and modified my portal styles and settings--and that had the effect that I'd been aiming for. So, I _think_ I'm in business?
May I ask whether you've found this in the docs somewhere that I've overlooked, or whether this was just a great hunch? Do you have any other words of wisdom?
Thank you VERY much for your help. You rock.
Alex
I don't believe it's doc'd, I just know because I worked on the product :)
Hi,
The solution was to control the look of these pages via the Customer Portal settings, to which my Site was tied via the 'Login' settings.
Thank you very much for the time you've spent helping me troubleshoot this.
Alex
Hi,
You can use pageblock tabstyle attribute in your code, and change the pageblock style according to your functionality