vCloud Director 9 HTML5 Portal Customization

One of the great features in vCloud Director 9 which has been further enhanced in the latest v9.5 release is the new HTML5 portal:

image

Even better, VMware has released a toolkit to allow Service Providers to fully customise the look and feel of the portal using CSS themes in their Clarity framework..

The toolkit itself is part of the VMware vcd-ext-sdk repository on github, available in the /ui/theme-generator folder.

The repository has good instructions on how to modify and build a custom theme, but actually uploading and configuring the theme in vCloud Director is only accessible via the vCD API and involves a reasonable amount of manual work.

To help speed up development and allow changes to be easily tested, in my usual mode I’ve written a small PowerShell module that allows quicker/easier theme configuration. The module is available on github at https://github.com/jondwaite/vcd-h5-themes. Hopefully this will help those of you who need to develop and test updated themes for your vCloud Director portals.

I’ve included documentation in the repository on each cmdlet, its function and arguments here.

To use the module you’ll need to be connected to a vCloud instance as a user with global ‘Administrator’ access in the ‘System’ organization since changes will affect all portal users. You’ll need to be connected to the vCD environment with PowerCLI (Connect-CIServer…) prior to using the cmdlets.

You can then download the vcd-ht-themes.psm1 file and add it to your session (‘Import-Module vcd-h5-themes.psm1’) to access the cmdlets.

As always, comments and feedback welcome – is there anything else you’d like to see added to this module?

Jon.

Tagged , , . Bookmark the permalink.

6 Responses to vCloud Director 9 HTML5 Portal Customization

  1. Kent Winsor says:

    Hello,
    Thanks for the tool. I can run Get-Branding, New-Theme, Set-Theme but if I try to use Set-Branding with any parameter I get the error below. Any insight would be greeatly appreciated. Powershell is aware of the function and parameter since tab pre-populates it.

    PS C:\Users\admin\Downloads\vcd-h5-themes-master> Set-Branding -portalName MyCloud
    Set-Branding : Parameter set cannot be resolved using the specified named parameters.
    At line:1 char:1
    + Set-Branding -portalName MyCloud
    + ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    + CategoryInfo : InvalidArgument: (:) [Set-Branding], ParameterBindingException
    + FullyQualifiedErrorId : AmbiguousParameterSet,Set-Branding

    • Jon Waite says:

      Hmm, is it possible you have a cmdlet name clash? What does ‘get-Command Set-Branding’ show? If more than one entry is returned you have another module providing a ‘Set-Branding’ cmdlet and PowerShell is confused about which one to use. To override this you can use ‘vcd-h5-themes\Set-Branding’ as the command. Let me know if you’re still having issues and I’ll take a look at the code, you could also try putting single-quote marks (‘) around the value for -portalName.

      Regards, Jon.

  2. Kent Winsor says:

    I checked for cmdlet name clash and it looks fine.

    PS C:\> Get-Command Set-Branding show

    CommandType Name Version Source
    ———– —- ——- ——
    Function Set-Branding 1.3.0 vcd-h5-themes

    I tried using single quotes yesterday and received same error. Seems like it can’t resolve for the function. If you can take a look that would be awesome.

    Thanks,
    Kent

    • Jon Waite says:

      Hmm, does it work if you specify a portalColor value? Wondering if the addition I accepted to remove portal colors has effectively made this parameter mandatory – will need to do some testing to confirm…

  3. Kent Winsor says:

    I have not been able to get Set-Branding to work at all with any value. Let me know if you can see why it doesn’t work. thanks.

  4. Kent Winsor says:

    Actually correction this worked for me so adding -portalColor with the rest worked.

    PS C:\> Set-Branding -portalColor ‘#3399FF’ -portalName ‘LAB Cloud’
    Branding configuration sent successfully.

Leave a Reply

Your email address will not be published. Required fields are marked *

*