Changing order of comm name / entry poster

[marama]

Hello. Wondering/hoping if this is doable. Currently on my reading page, when reading posts from comms, the user/comm names are listed as: 'user' posting in 'comm'. I believe the whole of that is surrounded by a span that includes both poster and entry-poster classes. I'm wondering if the following would be possible:

Reverse the order of user / comm so the comm name comes first.
Remove the 'posting in' text altogether.
Separate the span classes, so poster is surrounded by only the poster class span, and entry-poster with its own span class.

I'm pretty good at understanding css, but I've barely stuck a toe in the water for editing/customising theme layers. I might can figure out the code and how it works if I see it, but don't know enough to try anything without a starter code snippet at this point, or least a list of variables involved. Anyway, is it at all possible?

All help greatly appreciated; thank you.

Comments

[ninetydegrees]

#1 and #2 are easy enough with CSS although #2 can only be hidden with CSS rather than removed (but you could do it with layers):

.entry-poster {
color: transparent;
}

.entry-poster span + span {
float: left;
}

Not sure what you mean by #3 but pretty sure it's doable with layer editing. Sorry I can't say more right now but poke me and I'll get back to you if nobody beats me to it. ;)

[marama]

Thanks, I'll try it out soon as I get a chance.

Sorry if #3 sounded vague. Basically instead of one span with two classes, I want to separate the classes between two spans.

Currently it looks like:
<span class="poster entry-poster">...</span>

I'd like to change it to:
<span class="poster">comm</span> <span class="entry-poster">user</span>

I'm guessing that will require layer editing. I thought if I would need to edit the layer for that, perhaps I could include the solutions for #1 and #2 as well, though I think I'll go ahead with the css solution you've posted for those. Again, thank you!

[marahmarie]

You could try inline-blocking to save yourself coding a theme layer. Not saying it will work, but you could try this:

span.poster,span.entry-poster{display:inline-block;}

And add !important before the semi-colon at the end if it doesn't work right off the bat. I'm not at all sure if inline-blocking will do the trick but if does it will basically allow you to style both span classes as separate (but still hierarchically correct) block elements without messing the rest of your nearby CSS up.

Do you want to do this to flip the order of comm/poster? That I could try out for you myself, if you want.

ETA: Luckily your style sheet works on the same layout as this community's so that was easy. Ninety's code above works fine to flip the name order and hides the "posting in" text without any inline-blocking (which I never doubted, I just wasn't sure why you wanted to separate the spans) so if you still want to separate them (as opposed to merely styling them as separate entities) I'm pretty sure that, as said above, you will need a theme layer to do that.

[marama]

Thanks for the info. I wanted separate span tags for further separate styling of the two. Right now I would like the comm to have the subscription colours I picked while having a different style for the user name. While I'm guessing I could work around that purely in css, it'd be easier to style later if I change my mind or just want to try something different. Plus anything that gets me more familiar with theme layers is a good thing, I think, as I'd like to learn more about it.

[ninetydegrees]

Yep you could do all three at once. Ok so when you want to edit layers the first part is finding the right bit: this is usually something called a function or something starting with the word 'set' which is called a property. To do this you open the layer all the other layers depend on. It's called Core2 and you can find it at http://www.dreamwidth.org/customize/advanced/layersource?id=550&fmt=html.

A simple search for 'posting in' will lead you to:

property string text_posting_in {
des = "Text when user is posting in a community";
example = " posting in ";
}

and later this:

set text_posting_in = " posting in ";

What you wanna do for #2 and blank out this bit by changing it to this:

set text_posting_in = "";

Pretty easy so far, right? To do this you need to create a custom theme layer at http://www.dreamwidth.org/customize/advanced/layers but I think you already have one, correct? In this case, you only to add the line I mentioned above.

#1 and #3 are a bit more complicated. To find the bit you need to edit search for the more precise CSS class: entry-poster. At some point you'll find this bit:

# Prints the name of the account which posted the entry
function Entry::print_poster {
    var Page p = get_page();
    var string emptyclass = ((($p isa RecentPage and not $p isa FriendsPage) or $p isa MonthPage or $p isa DayPage) and $p.journal.journal_type != "C") ? "empty" : "";
    print safe "<span class=\"poster entry-poster $emptyclass\">";
    if ($p isa FriendsPage or $p isa EntryPage or $p isa ReplyPage) {
        $this.poster->print();
        if (not $this.poster->equals($this.journal)) {
            print $*text_posting_in;
            $this.journal->print();
        }
    }
    else {
        if (not $this.poster->equals($this.journal)) {
          $this.poster->print();
        }
    }
    print safe "</span>";
}

Now it's just a matter of reading the code. You can see where the SPANs are. You can guess that $this.poster->print(); prints the poster name whereas $this.journal->print(); prints the journal name. You can also see your by-now-familiar text_posting_in property (hmm seems you could have done all three here then!).

Now how to change it?

$this.journal->print(); is within an if thingie with brackets so to move it before $this.poster->print(); you have to move the whole thing like this:

# Prints the name of the account which posted the entry
function Entry::print_poster {
    var Page p = get_page();
    var string emptyclass = ((($p isa RecentPage and not $p isa FriendsPage) or $p isa MonthPage or $p isa DayPage) and $p.journal.journal_type != "C") ? "empty" : "";
    print safe "<span class=\"poster entry-poster $emptyclass\">";
    if ($p isa FriendsPage or $p isa EntryPage or $p isa ReplyPage) {
        if (not $this.poster->equals($this.journal)) {
            print $*text_posting_in;
            $this.journal->print();
        }
        $this.poster->print();

    }
    else {
        if (not $this.poster->equals($this.journal)) {
          $this.poster->print();
        }
    }
    print safe "</span>";
}

This takes care of #1.

You can also remove print $*text_posting_in;
This takes care of #2 (and you don't need the set line from before then).

Now #3 is a bit trickier because all of the conditional (if) statements. You gotta make sure that the SPANs are only printed if the element exists (there isn't always a community name or even a poster name) and that they're closed in the right place or you'll mess up your whole layout. I think it gives you this:

# Prints the name of the account which posted the entry
function Entry::print_poster {
    var Page p = get_page();
    var string emptyclass = ((($p isa RecentPage and not $p isa FriendsPage) or $p isa MonthPage or $p isa DayPage) and $p.journal.journal_type != "C") ? "empty" : "";

    if ($p isa FriendsPage or $p isa EntryPage or $p isa ReplyPage) {
        if (not $this.poster->equals($this.journal)) {
            print safe "<span class=\"poster\">";
            $this.journal->print();
            print safe "</span>";
        }
        print safe "<span class=\"entry-poster $emptyclass\">";
        $this.poster->print();
        print safe "</span>";
    }
    else {
        if (not $this.poster->equals($this.journal)) {
            print safe "<span class=\"entry-poster $emptyclass\">";
            $this.poster->print();
            print safe "</span>";
        }
    }
}

It might not be necessary to close the span both times but I'd rather do it that way to be on the safe side.

[marama]

Awesome! Not only the solution, but just being able to study it. I'd seen the code snippet on another post here, but yeah, I wasn't too sure with the if statements what needed to be moved. Thanks so much! Going to tinker with this for a few, just to get used to what it can do. Again, thanks!

[ninetydegrees]

(Awesome icon!)

You're most welcome! I'm always happy to explain stuff and, yeah, looking at the code and experimenting is the way to go. That's how I learned too. ;)