[personal profile] rhattusreviews posting in [community profile] style_system
Hello, I am looking for help in setting up a custom module/table/section to my blog, if that's possible.

Basically, I want to have a sidebar where I can have pictures, text, etc in addition to the actual custom text module. I'm willing to dive into the coding (stylesheets? layers?) directly to make this work, but I don't know much CSS and I don't know where to begin! The attempts I've made on my own have so far just killed the custom CSS and, as an insult, still not shown any extra text.

I actually got my inspiration from my current blog theme, because it includes an image that's linked directly to the custom CSS tab, not the custom text one. I'd love to be able to keep said theme but would be willing to switch to another if necessary.

If there's no way to make this work then that's fine, but I figured it doesn't hurt to ask!


(PS my blog is NSFW, you can instead see a live preview of the theme I'm using here)

Date: 2018-12-18 06:48 pm (UTC)
momijizukamori: Grey tabby cat with paws on keyboard and mouse. The text reads 'code cat is on the job', lolcats-style (CODE CAT)
From: [personal profile] momijizukamori
So there may be ways to do this with CSS, because CSS3 is WILD, but it would help to have a sense of how much text/images you're wanting to add, and whether you want stuff with links/additional HTML markup.

It's 100% possible to do almost anything with the layers system but that's also a lot more complicated to get started in, so if I don't have to send you down that rabbit hole, it's probably better :)

Date: 2018-12-19 09:24 pm (UTC)
momijizukamori: Green icon with white text - 'I do believe in phosphorylation! I do!' with a string of DNA basepairs on the bottom (Default)
From: [personal profile] momijizukamori

So I can think of a way to do it with the links list module, if you're not using it for anything else, though I'll have to test it first. Otherwise we're into the 'here be dragons' territory with S2.

Date: 2019-01-11 07:04 pm (UTC)
momijizukamori: Green icon with white text - 'I do believe in phosphorylation! I do!' with a string of DNA basepairs on the bottom (Default)
From: [personal profile] momijizukamori
Okay, sorry it's taken a bit to get back to you - holiday madness and all that! Here is the way I've worked out doing it with the link list, which lets you set the links to whatever you want through the wizard.


.module-typelist .module-list-item a{
height: 200px;
width: 200px;
display: inline-block;
font-size: 0;
vertical-align: top;
}
.module-typelist ul li {
margin: 0px;
padding: 0px;
display:inline-block
}

.module-typelist ul li:nth-child(1) a {
background: url("https://placekitten.com/200/200");
}

.module-typelist ul li:nth-child(2) a {
background: url("https://placekitten.com/200/220");
}

.module-typelist ul li:nth-child(3) a {
background: url("https://placekitten.com/240/220");
}


Modify height and width to whatever size you want the blocks to be, and then replace the image urls with your own. You can copy and paste that block and change the nth-child(#) number if you've got more than three.
Edited (closing tags are hard) Date: 2019-01-11 07:04 pm (UTC)

Profile

Dreamwidth style system discussion

April 2025

S M T W T F S
  12345
6 78910 1112
13 141516171819
2021 2223242526
27282930   

Style Credit

Expand Cut Tags

No cut tags
Page generated Jun. 9th, 2025 07:58 pm
Powered by Dreamwidth Studios