[4] Just Entry Headers Layout

[lina_trinch]

❖ Mobile friendly! ❖ Stylized control strip ❖ Tag & archive pages ❖ Navigation, links, and custom text modules ❖ Modules scroll out from the side on hover ❖ Intended to create a flat page with no scrolling ❖ Links change text/background/underline color on hover

code here!
temporary live-preview here!
imgur album preview here!

❖ This layout only features subject headers of entries and no content. It's intended to be a layout that entirely removes the need for a navigation entry/code. Of course, use it to the best of your potential and feel free to edit. I'd love to see what you do with it. ❖ Go to Select a New Theme and select Tabula Rasa, the Plain version. ❖ Copy and paste the code into the Use embedded CSS field under Custom CSS. ❖ At the top of the code, replace BACKGROUND_URL with the url of your chosen background image. I recommend something that's at least 1400px wide so it'll look okay on all devices. ❖ Under Choose Page Setup (at the bottom), select "1 Column (modules at bottom; no sidebar)," aka the first one. ❖ Make sure Use layout's stylesheet(s) is checked. In the Custom stylesheet URL field, paste in: https://fonts.googleapis.com/css2?family=Inconsolata:wght@300&display=swap ❖ OPTIONAL STYLE SUGGESTION. Go to the Text tab. Way at the bottom, remove the # symbol on the following options: • Text to show in a link to skip back through entries • Text to show in a link to skip forward through entries ❖ I know I chose like the worst background for the preview considering where the entries line up at but that's why I added that little hover effect. Not to mention, it shouldn't show up like that on smaller screens. I just didn't want to find another bg for Gambit again. #ebebeb rgba(0,0,0,0.0) rgba(0,0,0,0.2) rgba(0,0,0,0.6) rgba(0,0,0,0.8) rgba(0,0,0,0.9) rgba(0,0,0) rgba(235, 235, 235,0.4) rgba(235, 235, 235,0.7) rgba(235, 235, 235,0.9) rgba(255, 255, 255,0.9)

Comments

[shotgunslap]

Hey there! So I installed this theme on my kink meme comm, but I was expecting it to be the kind of splash screen theme where the first entry is what's displayed, rather than the listing of what's been posted on the comm. So basically I have this but I'd like to have something more like this. I'm looking at the coding of both themes and I kind of know what I'd need to change to do that, but I wanted to check in with you to be sure.

Thanks for any help you can offer me!

[lina_trinch]

Hi there! I like the look you're going after but it'd kinda be a whole new layout code. That said, a workaround wouldn't be too difficult.

What I would do without overhauling everything is use this code at the end of your current layout code and go to presentations to set the entries viewed on the recent page to 1. But if I remember correctly, it'll probably display the sticky entry and your "first" recent entry header. You could work around that by removing all instances of the word sticky- in the code I linked and making the entry you want to display as your most recent one by changing the post date to the year 2030 or something.

For it to display on the background so people can easily see it, you might have to change the entry's background or font color. You probably already know how but for redundancy's sake, my go-to for changing those would be:

Adding a background:
<div style="background: PUTCOLORHERE; padding: 5px; width: 600px;">TEXT</div>

Changing font color:
<span style="color: PUTCOLORHERE;">TEXT</span>

Let me know if this fix works for you. If nothing else, you've given me an idea for a new layout. I was trying to make a splash page on DW journals just the other day and now I realize I was thinking way too hard about it, lol.

[shotgunslap]

Thank you for your prompt reply! I added the add-on code and it didn't do anything, lol. However, I ended up deciding I liked the listing of posts after all! I'd look forward to you making a hybrid splash page code out of this, though. Cheers!

[lina_trinch]

Ah no, that must have been because the two codes were conflicting :( Sorry about that.

But I'm definitely going to make a code like that in the near future!

[winscenario]

Hello, darling! Is there any way to pick out how many entries are listed on the layout? So like only the top 5 or 10 entries would be listed out. Thank you!

[hatejakku]

Haha, HI, you caught me at a good time! And yep! Go over here and put whatever number you like into that first option at the top, Number of journal entries to show on the Recent Entries page. It'll be the same number of entries every time you go to previous/next, too.

[dark_ages]

Yeah it's what i did but that annoying "previous 8" is there mkdlfgd. just was hoping there was some way around that. thank you regardless, it looks nice anyway!

[hatejakku]

No prob! But we can fix that, too. If you wanna get rid of it, there's a few parts in the code that says .bottomnav. Erase those bits and put in:

.bottomnav { display:none; }

Alternatively, if you just want it to say "previous," go over here, scroll to the bottom, and there'll be Text to show in a link to skip back through entries. The field probably says "previous #" so just get rid of the hashtag, same for "next." Of course, you can also put whatever you want it to say in there.

edit: also i just looked and i love it lol

[dark_ages]

YES FANTASTIC you are a STAR. I love it, thank you so much ♥ and yes, I think it looks pretty nice! :D

[hatejakku]

\o/ You're welcome!!

[madehischoices]

Hey there! This is Beth and I am using the layout here I had a couple of questions. Is there a way to resize the image so that Castiel's name shows in its entirety? And How do I get the blurb to show up on the side?

[lina_trinch]

Hello!

For your background image, at the top of the code, you should see a portion that says body, that place where you put the background url.

In that whole bit, tack on:

background-position:bottom;

You can replace the word bottom with some percentages to play with the placement if you like.

However, I can't make the image resize in order to show everything without it getting too small. If you want to see what I mean, look at the portion that says background-size: cover; and replace cover with contain.


As for the blurb, it looks like I totally left that out in the instructions, oops. x.x To get that going, go to your Modules tab where you edit your layout and make sure that Custom Text is checked and under the Main Module Section. Then go to your Text tab and add your blurb in the space that's labeled for "Custom Text." The module won't show up at all if that section's empty.


If you have further troubles, let me know! I hope that helps. ♥

[madehischoices]

thank you! I switched the background and it looks great!

[galvanization]

Hi!

I'm trying to use this layout on this journal and I see dw has broken it somehow? The entries are no longer actually visible when you click on the links. Is there a way around this? Maybe forcing them to load in style=light or something?

[lina_trinch]

Hi! Unfortunately, that's how the layout is intended to look. I can't make the entries appear on just the entry pages without them also appearing on the main journal page.

You may be looking for something more like this or this where just the entry headers are shown initially but the rest of the entry appears when someone hovers over them. I think that might be the best alternative to getting the same overall feeling of this layout with the functionality of the entries.

[galvanization]

Are they not supposed to be visible at all when people click on them in the hover area? Like I can't get a visible entry to load anywhere at all, so I don't see how this layout... does.... anything. What am I missing?

[lina_trinch]

As it says in the description: "This layout only features subject headers of entries and no content." It's just purely for looks and entirely form over function.

If you've been using this layout and you were able to see the entries before, maybe Dreamwidth changed some settings for you? You can go here and scroll down to "Entry Pages: Shown to You" and select "Site skin" from the dropdown. Or perhaps "Entry Page Default: Your Journal" needs to be unchecked. Those are the default settings.

I can see how this layout can be frustrating for people who chose to change those settings, though, but this is the only layout I've made of this kind for that exact reason.

[galvanization]

I could never see the entries loaded on the main page and I didn't expect the titles over on the right to open them -- I thought it worked like a splash page, so that when you click on like "Permissions" or something in the hover-out menu, it goes there. I don't *think* I changed anything from the default? I used this layout once before and I thought I remembered it being functional as a nav page.

I'm sorry for sounding terse, it's not at you -- I'm just trying to figure out why dw no work lolol

UPDATE: THIS FIXED IT, THANK YOU. I can now use it as I wanted, as a splash page. DW had changed the default settings on me somehowwwww.

[lina_trinch]

When I click on your links, I see the entry content like so. That's why I was thinking it was to do with the settings. But as far as seeing the entries in this code's style, that's not possible with this layout. I could change it for you to make it work like that, but then we'd have to chose to either have the entries appear on hover like in those other examples I linked or just make the entries appear like normal.

You're fine, though! I'm just sorry I can't be of much help.

edit: OH GOOD I'm glad that worked for you!

[galvanization]

Nope, I didn't want to see them in the code's style, I just wanted to see them at all LOL. I was not seeing anything but my background until I changed the settings you recommended. I have no idea why they weren't set like that to begin with since this was the first change I made to this journal but here we are!

[lina_trinch]

That's wild, but at least we found the issue! I'm glad it's working for you as intended now. If you have any other issues with the layout, be sure to reach out! ♥

[galvanization]

Like for example: https://galvanization.dreamwidth.org/665.html -- I can't see the text of this anywhere no matter how I try to navigate to it.

[at_heart]

Was SUPER DUPER inspired by this layout. :3 Thank you for being so sweet when I came to you worried that I had been too inspired! Credit now links to the proper entry ❤️

[lina_trinch]

Of course! And thank you so much for the inspo credit link. ♥♥ I'm glad you like this layout a lot. ♥