Fix some annoyances with Customizer

Created:
Author: Christoph Stoettner
Read in about 3 min · 437 words

Toys at work

Photo by Ken Suarez | Unsplash

I created a git repository with some smaller CSS files to fix some annoyances within HCL Connections.

I started with this to prevent Orient Me to load fonts from external URLs or Elasticsearch Metrics to break the UI on larger screens. These issues are solved after the last updates I got from support, but Blogs and Tailored Experience Wizard can be improved with some simple rules.

Activate the CSS injection with Customizer

The following steps enable the changes.

Route /te-creation-wizard through customizer

Add the URL to NGINX configuration:

location ~ ^/(files/customizer|files/app|communities/service/html|forums/html|search/web|homepage/web|social/home|mycontacts|wikis/home|blogs|news|activities/service/html|profiles/html|viewer|te-creation-wizard)  {
                    proxy_pass http://cnx7-rh8.stoeps.home:30301;
                }

Add |te-creation-wizard to the rule which forwards to port 30301. Or find the line which starts with location ~ ^/(files/customizer|... and add it within the parenthesis.

So now the URL for Tailored Experience Wizards are routed through customizer.

Clone repository to customizer NFS share

cd /pv-connections/customizer
git clone https://github.com/stoeps13/stoeps-customizer-css.git

Import app to customizer

Import the file stoeps-customizer-css.json to the App Registry (URL: https://your-connections-url/appreg – you need the admin role in Common App to access it!).

Or use this snippet:

{
    "name": "CSS Customizations",
    "title": "Fixing tiny annoying things",
    "description": "Adding some css to fix the most annoying things..",
    "services": [
        "Customizer"
    ],
    "extensions": [
        {
            "name": "Blogs",
            "type": "com.ibm.customizer.ui",
            "payload": {
                "include-files": [
                    "stoeps-customizer-css/blogs.css"
                ],
                "cache-headers": {
                    "cache-control": "max-age=0"
                }
            },
            "path": "blogs",
            "state": "enabled"
        },
        {
            "name": "TE Wizard",
            "type": "com.ibm.customizer.ui",
            "payload": {
                "include-files": [
                    "stoeps-customizer-css/te-wizard.css"
                ],
                "cache-headers": {
                    "cache-control": "max-age=0"
                }
            },
            "path": "te-creation-wizard",
            "state": "enabled"
        }
    ]
}

Use New App > Code Editor > Import and save the changes to do this.

Which changes are active

Blogs

Without the customization, it is hard to see where a post starts or ends in the overview.

With the customization

Tailored Experience Wizard

I started this, because the Tailored Experience Wizard does not recognize changes in the communities-policy.xml. So if you have changed the available Community Types, like described in Preventing members from creating specific community types , all Community Types are still visible and in case of Restricted Communities, the creation fails for Communities created from a template, even for public or moderated Communities.

I have a case open with HCL on this, but until now there is no fix available.

Without the customization, all Community Types are allowed, there are two useless options on the left column.

With the customization

This will only hide the option, but when anybody changes the CSS in browser developer tools, or just use the API to create a community, this will be successful. The better option is to disable in the communities-policy.xml and wait for a fix until you enable the TE Wizard.

Author
Add a comment
Error
There was an error sending your comment, please try again.
Thank you!
Your comment has been submitted and will be published once it has been approved.

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

Suggested Reading
Card image cap

Yesterday I updated a Connections environment to the latest CFix. In other environments I found that PushNotification Cluster was not started after the update, like described in the knowledge base document PushNotification broken after upgrading to CFix.65CR1.2201 . In this update the application and cluster were running, but not working at all. Browser console.log showed the error:

Error connecting to push auth sync service /servic/info: RequestError: Unable to load https://cnx-fqdn/push/service/info status: 500
Created:
Last Update:
Read in about 1 min
Card image cap

The annual conference of DNUG took place in Constance from 22nd to 23rd of June 2022.

I attended the HCL Connections Roadmap session given by Rene Schimmer and David Strachan. They showed the updates for version 8 and beyond.

Created: Read in about 2 min
Card image cap

When I test topics with the different Connections editors (CKEditor, Textbox.io and TinyMCE), I always used multiple users in my test environment, installed the editor selector ear and then gave each of the test users a different editor. That’s easy with the different j2ee roles, but I always had to use multiple browsers or sandboxes to see them next to each other.

Created: Read in about 2 min