2

I've created a visualforce page that has an embedded chatter feed in it using tag.

Also, I am currently using bootstrap in my visualforce page that is already namespaced so that it doesn't conflict with the standard salesforce css. But since the chatter:newsfeed is embedded within my visualforce page it is technically within the page where the bootstrap css is being applied, and causing problems with the chatter layout. here are some of the screenshot of how the chatter looks within the visualforce page.

The padding got messed up: enter image description here

Same with the drop down actions: enter image description here

Messed up Hover mini-page layouts: enter image description here

Is there a work-around where I can isolate the chatter feed container from the bootstrap css so that it doesn't conflict with the chatter standard css?

Thanks in advance. Cheers

Improve this question

1 Answer 1

Reset to default
2

Maybe you want to create one page define chatter feed and then using iframe to locate it.

  <apex:iframe src="apex/Chatter_Feed_VF?Id={!$CurrentPage.parameters.Id}" height="350px" scrolling="true"/>
Improve this answer
2
  • No problem.The only concern is, Chatter is not bootstrap and it stay within bootstrap page.So it won't be responsive.If you can make chatter responsive,let me know.
    – unidha
    Aug 25, 2015 at 23:40
  • sure thanks! Update: Got problem with the iframed Chatter Newsfeed, whenever the user clicks a link in the chatter newsfeed it redirects the page within the iframe only and not the whole page. I'm assuming that this is how iframe works since you're showing an internal site within the parent page. Can I specify some settings in the iframe that will redirect any links in the parent page instead of redirecting it from the iframe only?
    – sfdx
    Aug 26, 2015 at 3:07

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .