|
| 1 | +:_content-type: PROCEDURE |
| 2 | +:description: Customizing OpenShift Eclipse Che branding images |
| 3 | +:keywords: administration guide, customizing, branding, images |
| 4 | +:navtitle: Customizing OpenShift Eclipse Che branding images |
| 5 | +:page-aliases: installation-guide:customizing-openshift-che-consolelink-icon.adoc, customizing-openshift-che-consolelink-icon.adoc |
| 6 | + |
| 7 | +[id="customizing-openshift-che-branding-images"] |
| 8 | += Customizing {ocp} {prod} branding images |
| 9 | + |
| 10 | +Customize the branding images for the {prod} dashboard by overriding the default images in the `assets/branding` directory. The following images can be customized: |
| 11 | + |
| 12 | +* `che-logo.svg` — the logo displayed in the dashboard header. |
| 13 | +* `loader.svg` — the loader icon displayed during dashboard loading. The loader image supports the following formats, in priority order: `jpg`, `jpeg`, `png`, `gif`, `webp`, `svg`. The `svg` format is used as the default fallback. |
| 14 | +* `favicon.ico` — the browser tab icon. |
| 15 | + |
| 16 | +.Prerequisites |
| 17 | + |
| 18 | +* An active `{orch-cli}` session with administrative permissions to the {orch-name} cluster. See {orch-cli-link}. |
| 19 | + |
| 20 | +.Procedure |
| 21 | + |
| 22 | +. Create a Secret that mounts custom branding images into the dashboard: |
| 23 | ++ |
| 24 | +[source,shell,subs="+quotes,+attributes"] |
| 25 | +---- |
| 26 | +{orch-cli} apply -f - <<EOF |
| 27 | +apiVersion: v1 |
| 28 | +kind: Secret |
| 29 | +metadata: |
| 30 | + name: {prod-deployment}-dashboard-customization |
| 31 | + namespace: {prod-namespace} |
| 32 | + annotations: |
| 33 | + che.eclipse.org/mount-as: subpath |
| 34 | + che.eclipse.org/mount-path: /public/dashboard/assets/branding |
| 35 | + labels: |
| 36 | + app.kubernetes.io/component: {prod-deployment}-dashboard-secret |
| 37 | + app.kubernetes.io/part-of: che.eclipse.org |
| 38 | +data: |
| 39 | + che-logo.svg: __<Base64_encoded_content_of_the_image>__ <1> |
| 40 | + loader.svg: __<Base64_encoded_content_of_the_image>__ <2> |
| 41 | + favicon.ico: __<Base64_encoded_content_of_the_image>__ <3> |
| 42 | +type: Opaque |
| 43 | +EOF |
| 44 | +---- |
| 45 | +<1> The dashboard logo. Replace `che-logo.svg` with the Base64-encoded content of your custom logo with disabled line wrapping. |
| 46 | +<2> The loader icon. Replace `loader.svg` with the filename matching your image format (for example, `loader.png`, `loader.webp`). The value is the Base64-encoded content of the image with disabled line wrapping. |
| 47 | +<3> The favicon. The value is the Base64-encoded content of the `.ico` file with disabled line wrapping. |
| 48 | ++ |
| 49 | +NOTE: You can override one or all images from the `/public/dashboard/assets/branding` directory in the dashboard pod. Only the images specified in the Secret `data` section are overridden; unspecified images remain unchanged. |
| 50 | + |
| 51 | +. Verify that the rollout completes: |
| 52 | ++ |
| 53 | +[source,shell,subs="+attributes"] |
| 54 | +---- |
| 55 | +{orch-cli} rollout status deployment/{prod-deployment}-dashboard -n {prod-namespace} |
| 56 | +---- |
| 57 | + |
| 58 | +.Verification |
| 59 | + |
| 60 | +* Open the {prod} dashboard in a browser and confirm that the custom branding images are displayed. |
| 61 | + |
| 62 | +.Additional resources |
| 63 | + |
| 64 | +* link:https://docs.openshift.com/container-platform/{ocp4-ver}/web_console/customizing-the-web-console.html#creating-custom-links_customizing-web-console[Creating custom links in the web console] |
0 commit comments