Setting up Hubs Cloud - Home Page Customizations?

[jl3471]

Hi, I was wondering if there's any way to change the look and feel of the homepage for my Hubs Cloud. Specifically, "pinning" three rooms for meeting purposes, rather than letting people "Create" new rooms.? My thinking is that I want my students and any visitors to join class sessions or various events so I'd like to have permalinks to rooms I already created and to remove "Create a Room" or any unnecessary buttons to keep it as simple as possible.

How would I change or customize the homepage?

[robinkwilson]

You can customize the homepage + remove any buttons by modifying and deploying a custom client. You'd follow this guide and modify the current homepage as much as you'd like: Hubs docs: Deploying Custom Clients

Remember to base your custom client on the "hubs-cloud" branch, not the "master" branch.

[jl3471]

Hi - I read the guide and don't completely understand this. So, I can clone the repository and start the local dev server.. now how would I actually modify the look and feel of the welcome homepage? Is it changing an index.html file to anything else or what would I do?

[robinkwilson]

I realized you can approach this two different ways:

1. No coding approach via the Admin Panel

You can remove the Create a Room button and "Feature" specific rooms for your HC instance that will show up on the home page.

Add a list of Rooms to the Homepage
Admin Panel > App Settings >Features tab > Enable the "Public Rooms" setting
Remember you can Limit Access to your hub with accounts only access

To add room to homepage
Enter room > Click Hamburger Menu in upper left corner > Room Settings > Set this room as public
Check your homepage, you'll see it listed.

Remove Create a Room button
Your hub Admin Panel > App Settings > Rooms tab > Enable the "Disable room creation" setting

2. Coding approach via custom client

I provided you a link to the coding approach with full client customization at your disposal. You'd follow those instructions then customize the HomePage.js file with your specific rooms + any other customizations you want.

Hope this helps you!

[ocularvr]

This just does not work, I don't know how else to tell you:

https://hubs.mozilla.com/docs/hubs-cloud-custom-clients.html

[robinkwilson]

I realized you can approach this two different ways:

1. No coding approach via the Admin Panel

You can remove the Create a Room button and "Feature" specific rooms for your HC instance that will show up on the home page.

Add a list of Rooms to the Homepage
Admin Panel > App Settings >Features tab > Enable the "Public Rooms" setting
Remember you can Limit Access to your hub with accounts only access

To add room to homepage
Enter room > Click Hamburger Menu in upper left corner > Room Settings > Set this room as public
Check your homepage, you'll see it listed.

Remove Create a Room button
Your hub Admin Panel > App Settings > Rooms tab > Enable the "Disable room creation" setting

2. Coding approach via custom client

I provided you a link to the coding approach with full client customization at your disposal. You'd follow those instructions then customize the HomePage.js file with your specific rooms + any other customizations you want.

Hope this helps you!

[ocularvr]

Hi, the documentation provided is not correct.

https://hubs.mozilla.com/docs/hubs-cloud-custom-clients.html

After installing npm as instruced, i run the command and get this back. please advise.

npm ci

Usage: npm <command>

where <command> is one of:
    access, add-user, adduser, apihelp, author, bin, bugs, c,
    cache, completion, config, ddp, dedupe, deprecate, dist-tag,
    dist-tags, docs, edit, explore, faq, find, find-dupes, get,
    help, help-search, home, i, info, init, install,
    install-test, issues, it, la, link, list, ll, ln, login,
    logout, ls, outdated, owner, pack, ping, prefix, prune,
    publish, r, rb, rebuild, remove, repo, restart, rm, root,
    run-script, s, se, search, set, show, shrinkwrap, star,
    stars, start, stop, t, tag, team, test, tst, un, uninstall,
    unlink, unpublish, unstar, up, update, upgrade, v, verison,
    version, view, whoami

npm <cmd> -h     quick help on <cmd>
npm -l           display full usage info
npm faq          commonly asked questions
npm help <term>  search for help on <term>
npm help npm     involved overview

Specify configs in the ini-formatted file:
    /root/.npmrc
or on the command line via: npm <command> --key value
Config info can be viewed via: npm help config

[ocularvr]

And when trying to run login i get:

> node -r @babel/register -r esm -r ./scripts/shim scripts/login.js

module.js:549
    throw err;
    ^

Error: Cannot find module '@babel/register'
    at Function.Module._resolveFilename (module.js:547:15)
    at Function.Module._load (module.js:474:25)
    at Module.require (module.js:596:17)
    at Function.Module._preloadModules (module.js:753:12)
    at preloadModules (bootstrap_node.js:472:38)
    at startup (bootstrap_node.js:185:9)
    at bootstrap_node.js:609:3

npm ERR! Linux 5.3.0-1034-aws
npm ERR! argv "/usr/bin/node" "/usr/bin/npm" "run" "login"
npm ERR! node v8.10.0
npm ERR! npm  v3.5.2
npm ERR! code ELIFECYCLE
npm ERR! [email protected] login: `node -r @babel/register -r esm -r ./scripts/shim scripts/login.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] login script 'node -r @babel/register -r esm -r ./scripts/shim scripts/login.js'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the hubs package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node -r @babel/register -r esm -r ./scripts/shim scripts/login.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs hubs
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls hubs
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /var/snap/amazon-ssm-agent/2012/hubs/npm-debug.log

[ocularvr]

Come on guys, we are talking about changing an image on the homepage, is it really necessary to throw users into this black hole? The whole reason im doing this is because the out of the box installation of hubs personal is faulty. The App logo is justified to the left and not centered as it should......

[robinkwilson]

How to center the logo discussion:
#2978

[NADIABOUK]

Hello, I installed on my own cloud hubs server for my company. I can't customize the home page, I explain my problem: I downloaded a home background image, it's ok. But I'd like to change the layout of the "create virtual room" buttons and the text replace "create a virtual room". Also at the bottom of the page I want to customize with our contact information because currently it's still written hubs cloud and links at the bottom of the page. On the home page I want a simple access, just login

[Dreamfullstacker]

Hello I have a issue while following these steps
I have deployed Hubs Cloud on my AWS
for this, I have created domain on my AWS 53 (*.com and *.link)
and then create stack on Hub.
so the created Cloud server is https://stealoo-cinema.com/
You can check the live Hub Cloud server on there.
so now, I want to customize the Hub Cloud Client.
Following your steps, I have forked the mozilla/hubs and clone my fork to my local
After install dependencies using npm ci.
I have tried to login my hub cloud server
But I received error message
“Sorry that doesn’t looks like a Hub Cloud server”
How to solve this problem.
Help me pls