Customer Service forum

Microsoft Portal Themes

(0) Share

Report

Posted on by Damesh Peri

123

Hi,

I am relatively new to Microsoft portal.

I wanted to change the colour scheme of the default portal, I have read https://docs.microsoft.com/en-us/dynamics365/customer-engagement/portals/create-theme

but this doesn't seem to work. I download the bootstrap.min.css file from Bootswatch.com.

Ive tried amending the current bootstrap.min.css file as well as uploading a new one, and both don't pull through the new styling, am I missing a step?

Thanks

Damesh

Categories:

Portals

All responses (8)

Answers (3)

Damesh Peri 123 on at

Like (0)

Report

RE: Microsoft Portal Themes

Thanks for your help. I was using bootstrap 4 rather than 3.
Verified answer

Inogic 24,094 on at

Like (0)

Report

RE: Microsoft Portal Themes

The above steps i believe work for modifying the css for each page individually. If you would like changes to be reflected globally, using theme.css and bootstrap.css would do the trick.

Sam
Verified answer

Byron Dittberner 235 on at

Like (0)

Report
RE: Microsoft Portal Themes

Good Day

Personally, I would not modify the bootstrap.min file nor the theme file. To change the colors of the font, backgrounds etc, you can do this directly on the portal with basic CSS. try the below...

To Start you must be an administrator on the Portal

register as a portal user(contact)

Once registered, from CRM search for the contact you just created. Change the contact form to "Portal Contact"

Scroll down and look for the Grid, "Web Roles", assign the contact "Yourself" the Administrator Role. (This should not be confused with the Security Role, Web Roles are assigned to Contacts which govern permissions on the Portal)

Once you are an Administrator on the Portal, Refresh the Portal.

You will see a PopUp Control floating on the top right of your screen. This indicates you are now accessing the portal as an Administrator.

Next you can start changing colors and fonts, personally, I do this by directly identifying the Classes or ID of the elements I would like to effect.

Navigate to the page you would like to edit, then select Edit on the control

Next Select the TAB, "Options"

Next, in the CSS section, you can start writing your CSS

When you are done, save your changes. On save, the code editor will close and your changes will take effect immediately.

NB! to find the classes of the elements, simply navigate to the page you wish to edit and then press F12, using the element selector, click on the element you would like to change thus showing you the class/ID of the element.

Here is a sample video I created for you - https://youtu.be/gTjcxckzaV0

Soon I will be hosting a series of webinars on my LinkedIn group, ABC's for Dynamics where I will be featuring tips and tricks to Customizing and configuring Portals, you are welcome to connect with me for help. https://www.linkedin.com/groups/13709301/

Should you find this post helpful, please mark as Verified and awesome
Kalpavruksh D365 CoE 2,545 on at

Like (0)

Report

RE: Microsoft Portal Themes

Hi,

After uploading the new CSS try to clear the cache of the portal, and Restart portal.

To clear cache of portal, use this link logged in with portal admin role https://yourportaldomain.microsoftcrmportals.com/_services/about
Verified answer

Justin Wilkinson 1,336 on at

Like (0)

Report

RE: Microsoft Portal Themes

Hi Damesh,

I hope the following links will be useful - I also have had issues with this, I exported the default theme.css.

I then searched within the colour hexcode in developer mode in chrome and updated those in bulk in the theme.css - this video and blog might help:

cloudriven.fi/.../

megan walker also has so many amazing blog posts on portals that are helpful:

meganvwalker.com/

docs.microsoft.com/.../create-theme
Suggested answer

Inogic 24,094 on at

Like (0)

Report

RE: Microsoft Portal Themes

Dynamics 365 portal has been using bootstrap for the frontend design. You can very much customize the design of the portal by changing the default bootstrap design to the custom one. To change the bootstrap theme we need to add new bootstrap.min.css in “bootstrap.min.css” Web File record as a notes attachment.

I think you are attaching new bootstrap.min.css file but it is not working correctly. I can see Navbar breaks, it has been showing vertically. It seems that the bootstrap that you have generated is not compatible or working with the portal. You can try by using official bootstrap customizer to customize and download the bootstrap and upload the newly generated bootstrap in Web File in CRM. Try by changing background color, font color. You will see the difference.

Sam
Damesh Peri 123 on at

Like (0)

Report

RE: Microsoft Portal Themes

Hi Leo,

Thanks,

I got the same layout when I used the ADXstudio suggestion.

Look forward to hearing back.

Thanks

Damesh
LeoAlt 16,329 on at

Like (0)

Report

RE: Microsoft Portal Themes

Hi partner,

You should custom the bootstrap first (make some differece from the default one) and then upload it into portal.

BTW, you could also try this way.

nishantrana.me/.../

community.adxstudio.com/.../

I also tried the ways of the above blog but there seems to be something wrong with my css.

I will work out it and notice you as soon as possible.

Hope it helps.

Best Regards,

Leo