Talk:Global Lua Modules/Quote

This is not puzzle

Lua error in Dev:Quote at line 55: attempt to concatenate local 'person' (a nil value).--＊Lac＊(♪) 14:40, January 26, 2020 (UTC)

Uh, where are you getting that error? It looks like you haven't specified an argument to the module properly. -- Cube-shaped garbage can 15:40, January 26, 2020 (UTC)

I can't person info from Template

The double asterisk is “D”

Can't see "flavor text aka blurb"--＊Lac＊(♪) 04:22, March 7, 2020 (UTC)

error concatenating local person "nil"

Keep getting the same error as above, where if i provide only "text" and "source" arguments, the template breaks, printing the error message

Lua error in Dev:Quote at line 55: attempt to concatenate local 'person' (a nil value).

this used to work just fine before- any ideas what's wrong?

-- Wovenstarlight (talk) 17:31, 5 June 2021 (UTC)

Should be fixed now. Nam 09:58, 7 June 2021 (UTC)

Thanks, appreciate the help! -- Wovenstarlight (talk) 14:48, 22 June 2021 (UTC)

Error with quotation mark display?

Any reason why the template's double quotes have started showing differently on Fandom Desktop? Now only the opening quotes show up and the end quotes (::after element) aren't even loaded in, for some reason. It looks like it used to on mobile. It was working fine just a couple weeks ago.

How the sample on the template page looks (Fandom Desktop, dark mode)

-- Wovenstarlight (talk) 14:59, 22 June 2021 (UTC)

That seems to be an intentional change by Fandom, one of many changes in the global CSS for the new skin. Here is the current applied CSS, so you can override it on a wiki you admin - it is still subject to changes though.

.page-content .mw-parser-output .pull-quote {
    font-style: italic;
    margin: 0;
    padding: 0 30px
}

.page-content .mw-parser-output .pull-quote:before {
    color: var(--theme-link-color);
    content: "“";
    display: block;
    font-size: 150px;
    font-style: normal;
    line-height: 75px;
    margin: 40px 0 -60px -5px
}

.page-content .mw-parser-output .pull-quote__text {
    font-size: 16px;
    margin-bottom: 0
}

.page-content .mw-parser-output .pull-quote__text:after,.page-content .mw-parser-output .pull-quote__text:before {
    display: none
}

.page-content .mw-parser-output .pull-quote__text__source {
    font-size: 12px;
    font-weight: 500
}

Nam 10:16, 24 June 2021 (UTC)

Adding an image to the left of the quote

Hello!

I've been eying this template for a while and I really like it—I'm close to importing it into another wiki. But the reason I haven't pulled the trigger is because it's missing the ability to display images (e.g. profile pictures) to the left of the text, which is a feature our old quote template has that everyone I've talked to (myself included) is reluctant to let go of.

Would it be possible to add this functionality into the base template? If not, would anyone be able to give me some pointers on how I can get started on doing this myself?

Thanks! —Blue, 04:00, 6 August 2021 (UTC)

The module accepts generic Wikitext, including images, but the specific layout may need some customization on a specific wiki. Can you give a link to the template you are using now?

Nam 06:57, 6 August 2021 (UTC)

Yep, here you go: https://mineplex.fandom.com/wiki/Template:Quote —Blue, 05:01, 7 August 2021 (UTC)

Nevermind, it seems that too many issues are going to rise if we would try to replace your existing template with this (the alignment of the image, the way the paremeters of the template are passed, some incompatible CSS you have on MediaWiki:Quote.css). Maybe do it the other way around - what is the reason you wanted to replace the template? Maybe you can keep the template but change something in it. Nam 22:20, 7 August 2021 (UTC)

I'd like to replace the template because the one we're currently using is a bit outdated both in terms of code (it uses a table for formatting when, for example, a newer standard like flexbox would be more suitable) and, subjectively, in terms of design (there's not a lot of color/style in it). I'd like to use the newer template because it uses Lua (which is cleaner than wikitext and offers better performance), features a more modern design, and is more consistent with how quotes display on mobile. I think I have a sufficient understanding of HTML and CSS to come up with something better than what we have now myself, but I much prefer the version here on the Dev Wiki.

In other words, I have no issues with tearing it all down and starting from scratch (no need to preserve anything from MediaWiki:Quote.css, for example). I've consulted with the rest of the community on our wiki and they seem to be okay with this. —Blue, 22:44, 8 August 2021 (UTC)

Alright then, I have figured out I would suggest the following code for the template:

{{#if:{{{image|}}}
|{{#invoke:Quote|quote
  |class = pull-quote-with-image
  |[[File:{{{image}}} |{{{image size|64px}}} |class=pull-quote__image]] {{{1|Insert the text of the quote here, without quotation marks.}}}|{{{2|}}}|{{{3|}}}}}
|{{#invoke:Quote|quote|{{{1|Insert the text of the quote here, without quotation marks.}}}|{{{2|}}}|{{{3|}}}}}
}}<noinclude>
{{documentation}}
[[Category:Quotation templates]]
</noinclude>

and the following CSS to add to MediaWiki:Quote.css - not strictly required but I believe it looks better:

.pull-quote-with-image .pull-quote__image {
    float: left;
    margin-left: -120px;
    margin-right: 1em;
}

Nam 21:50, 9 August 2021 (UTC)

I've copied everything over and it looks pretty great. Thanks! There are some small issues that've come up, though:

• The additional spacing added to accommodate the image looks fine on the template page, but causes the image to clip off an article page if something like an infobox is to the right (example).
• I can't seem to change the quote mark to use our wiki's accent color. I've tried editing MediaWiki:Quote.css, but that doesn't work. Perhaps I need to add the code directly onto MediaWiki:Common.css.

—Blue, 01:10, 11 August 2021 (UTC)

┌────────────────────────────────────────────────────────────────────────────────────────────────────┘ Alright, try this CSS instead of the previous one (I have also made it more consistent with the existing code):

#content .pull-quote-with-image {
    padding-left: 150px;
}

#content .pull-quote-with-image .pull-quote__image {
    float: left;
    margin-left: -120px;
    margin-right: 1em
}

Or alternatively, you can choose to drop that CSS entirely and leave the image with the text.

For the color of the quote mark, put this:

#content .pull-quote::before {
    color: var(--theme-accent-color);
}

Nam 08:36, 11 August 2021 (UTC)

Works like a charm. Many thanks for your help! —Blue, 23:17, 12 August 2021 (UTC)

I've been tinkering around with some of the styling. Would it be possible to remove the space between the quote text and the source text if the quote text isn't long enough? For example, currently on the template page, there's a vertical gap between "Lorem ipsum" and "Julius Caesar, Rome". Thanks! —Blue, 22:07, 13 August 2021 (UTC)

The following seems to work. The selector is very specific to avoid unexpected side effects as much as we can.

.pull-quote-with-image .pull-quote__text > a.image:first-child {
    float: left;
    height: 0;
}

Nam 20:30, 14 August 2021 (UTC)

That works. Thanks again! —Blue, 23:10, 14 August 2021 (UTC)

Ensure source parameter appears on mobile

Hello! It's me again, stirring up trouble yet another time. On my wiki, when I view the modified quote template on mobile, the source parameter (i.e., the third unnamed parameter) doesn't appear. Is there a way to fix this? Thanks! —Blue, 00:21, 22 August 2021 (UTC)

If I recall correctly, it's a bug in the mobile skin that simply strips the third parameter on quote templates as if it never existed. You may submit a bug report about that via Special:Contact

I believe you can work around this by changing the type of the template from "Quote" to "Design" (without changing the code). But this may ruin the special quote styling on mobile.

Another thing you can try — I can't tell if it will work or not, as there is now way to test out stuff in mobile skin without saving the page — is to use the named parameter "source" instead of the unnamed one.

Good luck! Nam 21:32, 22 August 2021 (UTC)

Thank you for the suggestions. I tried both by themselves and then together, and some combination of those two worked. But then I noticed that the quote image had shown up on mobile in an awkward way, so I tried adding the hidden class to the image. Then the fix stopped working all of a sudden, and even when I removed the hidden class, I couldn't seem to get the fix to work again. Not sure why.

I'm not sure if it's 100% a Fandom bug—for example, the documentation for the quote template here on the Dev Wiki seems to display the source parameter fine. Which makes it even stranger.

I'll keep fiddling around with the template on my wiki and see if I manage to get the third parameter to show up again on mobile. If it doesn't in a day or two, I'll send a bug report. I'll update here as necessary. —Blue, 00:53, 23 August 2021 (UTC)

I have made some testcases and it seems to be definitely a matter of the template type. The template type "Quote" strips the third parameter and I couldn't find any way around it except using another template type. Your type-modified template seems to work fine now too.

The examples on the doc page, if you look at the source code, actually bypass the template and call the module directly and this is probably why they appear correctly.

Nam 11:35, 23 August 2021 (UTC)

Very interesting. Many thanks for your help. I'll submit a bug report on the third parameter type issue. —Blue, 00:01, 24 August 2021 (UTC)

Quote mark color

Hi, I was wondering if the quote mark color could be made into a paramemter insted of being a default color. Printer89 (talk) 15:23, 14 January 2022 (UTC)

It's possible to change quote mark color. Simply go to MediaWiki:Common.css and type like this:

:root {
  /* The color of the " marks. */
  --pull-quote-mark-color: <hex code here>;
}

The place in hex code here is where you can type a hex code. For example, you want the quotation mark to be red, so: #FF0000. Design explains how you can customize that quote template. —Baran ^☪︎ 16:32, 14 January 2022 (UTC)

If i'm understanding the question right, you may have meant that you wanted to make the quote color a parameter for the template itself, same as text and person and source. In that case, you could set up your Template:Quote as follows:

{{#invoke:Quote|quote|style=--pull-quote-mark-color: {{{quotemarkcolor|#DEFAULT_COLOR_HERE}}};}}

That'll allow you to set a default quote color (simply replace #DEFAULT_COLOR_HERE with a hex code or color name such as #ff0000 or red), but you'll also be able to replace said color on any use of the template, so that you can use it like this:

{{Quote
|text = Your quote here.
|person = Speaker McSpeakerson
|source= Sample Source
|quotemarkcolor = #e8b201
}}

Hope that helps! -- Wovenstarlight (talk) 18:14, 14 January 2022 (UTC)

Thank you very much. I shall try it soon. Printer89 (talk) 23:31, 14 January 2022 (UTC)