Not sure if there's a way to do this and make the home page a house for buttons that will access various buttons for the page without making it look wonky. I've tried a few of the Navbar mods I've found lying about in tutorials but still can't really get the look I was hoping for.
Here's the page.
https://wilderlandadventures.obsidianportal.com
I'd like to use the triboxes for navigation, instead of the Navbar. Would anyone care to drop any hints or tips on how to accomplish this, if possible? Thanks in advance!
It looks like you're new here. If you want to get involved, click one of these buttons!
Comments
This isn't too tough to accomplish, but does require ascendant status if you aren't already. You'll use the custom CSS to "display:none" the standard navigation (I forget the class/id's required off the top of my head, but they can be found easily enough with your browser's element inspection). Then use HTML elements (divs, links, images, etc..) to create your tribox replacement.
A thing to note with this, you'll want to have some manner of reverse navigation or easily accessible "Home" link to keep the site straightforward to navigate for visitors, especially new visitors who are used to having the standard navigation.
EDIT: Another thing worth mentioning here, you'll want to make sure that you are only targeting the public portion of the site with your CSS if you still need the standard navigation on the dashboard side of things, so be careful with that.- Kallak
Okay, I think I've figured something out. Anyone here willing to check it out and see how the navigation works for them and let me know how it goes?
https://wilderlandadventures.obsidianportal.com
Generally, I can get around, but it does require a couple extra clicks depending on where I am and where I want to go compared to the navbar.
There is no way to leave the maps page without hitting the back button.
The character and item pages requires you to enter an item/character to get out of there.
It will mean you can't use DST character sheets (which may not be an issue, but some players really like using them).
They are among us!
XCom: Defiance - Campaign of the Month November 2016
Thanks for your input!
I was noticing that myself about the characters, items & maps pages. I am still trying to think on that one. Not sure how to get around it yet.
The DST sheets for 5th Ed are not that impressive to me, so I'm fine with that part.
You could make the navbar visible on those pages only (character-index, campaign-map-index, and item-index) and change the icons to smaller versions of your Tree on a green background image.
Something like this
I used your image put cropped it and scaled it down to 36px
Also you wouldn't need to display every link on the nav bar, maybe just the ones you want.
They are among us!
XCom: Defiance - Campaign of the Month November 2016
That worked really well for the navbar. Thank you! The only thing that is annoying me is that I cannot locate the background rgba behind the icon row in the navbar to make it transparent.
I used the below, which does change the code rom rgba to transparent in the inspector, but it does not change the appearance of that background color when viewed.
.campaign-public-layout #campaign-nav {background-color:transparent;}
Not sure where I'm missing it.
There are two places to add background-color:transparent codes in the nav bar one for the #campaign-nav as you figured out.
The second for the .campaign-public-layout #campaign-nav .icon (which is the smaller darker one)
They are among us!
XCom: Defiance - Campaign of the Month November 2016
Thanks for all the pointers, c. I don't know if I will get rid of the navbar for sure. It actually looks pretty nice now.
Yeah, it does look good.
Giving pointers actually helps me come up with ideas of what to do for mine campaign site. I added some alternate icons on my nav bar shortly after suggesting it for yours.
They are among us!
XCom: Defiance - Campaign of the Month November 2016
cgregory - I tried pasting that little snippet in, and had no results, am I missing something obvious?
Campaign of the Year - 2018
Should be fairly straight forward. Do you still have the snippet of code saved to your css? If so i can take a look and see what is wrong.
In my campaign I've changed every one of the icons from the standard.
They are among us!
XCom: Defiance - Campaign of the Month November 2016
Yessir, still saved in my CSS.
-bort
Campaign of the Year - 2018
Looks like I've changed the code slightly on my site. Try without the quotes around the url/
Also looks like you have in in your code twice.
They are among us!
XCom: Defiance - Campaign of the Month November 2016
Getting there... the quotes impacts something, as the old image falls away, but no new image comes in place. I swapped my own image in, and still not getting anywhere. Feeling pretty dense on this!
-bort
Campaign of the Year - 2018
Odds are you have an extra bracket or are missing a bracket somewhere in your code.
try moving that code to the first line of you custom css to see if it makes a difference. If it does it means you have an extra bracket, quote, etc somewhere in your code.
notepad++ is a nice tool for finding extra or missing brackets, quotes etc. I'll copy your css into notepad++ to see if something is messing up the parsing.
They are among us!
XCom: Defiance - Campaign of the Month November 2016
I see what it is you have a ; at the end of the content url. It is preventing the image from loading.
content: url(https://db4sgowjqfwig.cloudfront.net/campaigns/67984/assets/657915/wiki.png;);
change it to
content: url(https://db4sgowjqfwig.cloudfront.net/campaigns/67984/assets/657915/wiki.png);
They are among us!
XCom: Defiance - Campaign of the Month November 2016
Hah, wow, i'm a special kind... Thanks man!
-bort
Campaign of the Year - 2018