No, it's not the WikiLove extension. It's a new feature being tested on a couple dozen wikis. Feel free to leave feedback in the #feedback-fandom channel on the Fandom Discord. :)
I love all of these fixes. I've been affected by at least half of them. Cheers! <3
AT LAST! I :heart: this! (specifically, the exact-match search)
@Tantrumbunny Please post a link to an example page so we can see what it is you desire.
I managed to convert all of our infoboxes to the portable type and recreated the original style with about 25 CSS selectors. The problem is that the "theme-source" feature is not very convenient for making small changes to the basic infobox style. (We change things like border color, background color, title background and sometimes the flex-basis of the columns.) Every time I add a new theme-source, I have to add its title to all 25 selectors before I can add the few extra selectors for the new style (there are 15 of them now). To see what I mean, here is ONE of the 25 Portable Infobox selectors in my CSS file:
.pi-theme-frwiki .pi-group, /* group border */ .pi-theme-rlc .pi-group, .pi-theme-plant .pi-group, .pi-theme-fungus .pi-group, .pi-theme-road .pi-group, .pi-theme-mountain .pi-group, .pi-theme-at-will .pi-group, .pi-theme-daily .pi-group, .pi-theme-encounter .pi-group, .pi-theme-ritual .pi-group, .pi-theme-aberration .pi-group, .pi-theme-elemental .pi-group, .pi-theme-fey .pi-group, .pi-theme-immortal .pi-group, .pi-theme-shadow .pi-group, .pi-theme-ship .pi-group { border: none; }
Needless to say, this is getting cumbersome. I would like a more convenient way of making minor changes to the basic infobox style. Perhaps instead of changing the name of the class with "theme-source", you add a class with that name so we can use it to make small changes and still reap the benefits of the basic CSS we already have.
I reported this bug (Ticket 248044) a while ago.
@TheSonic103ify
You just need to upload some images to your wikia. I added one of your three existing images to the page you were working on and it does indeed work. You do not need the File:
or the brackets, just the exact file name of an image in your File List. Good luck with your new wikia!
@LoveRobin
The PI converter routine works for simple infoboxes, but needs massaging for most anything with logic in it or fields that depend on other fields. I'll take a look at your stuff if you'd like.
@Hollowness
I have some pass-through templates that are very much like your transformers. All they do is change the look of the infobox (now using theme-source), so I set them to type "Design". I haven't bothered with Insights much yet, just converting my infoboxes to portable is all I'm doing right now. I think you can safely ignore most of what Insights tells you, if you wish.
@Hollowness
I feel your pain. I took a look at your infoboxes and transformers and I think you should be able to convert them. However, the transformer concept will probably require the use of the theme-source feature, which allows you to customize the CSS by using a parameter passed in through the infobox call. I have made extensive use of this on my wiki. You will find Help:PortableInfoboxes/CSS very useful and there is a full set of bare-bones CSS selectors posted on the portability wiki and you can ask questions in the Forum. Good luck!
To put a border around the image, you can do this:
.pi-image-collection .pi-image-thumbnail { width: 85%; height: 85%; border: 3px solid purple;
If you want to get really fancy, scroll up a ways you will see some CSS that I posted to make the Portable Infobox tabber/gallery look like the regular <tabber>. You can modify that to match your color scheme. Note that it currently only works if the tabs don't extend beyond the edge of the infobox, but it can handle two tabs just fine. Post a message on my wall if you have questions.
You can try to inherit the background color from the surrounding infobox by using:
.pi-image-collection-tab-content { background-color: inherit; }
If that doesn't work, you can replace "inherit" with a color.
@Cqm:
I think Wikia did a great service to the community by allowing tabbers as arguments to the <image> field. Implemented as you describe, it would have required the editing of thousands of pages and taken up many hours of people's time. So, yay for backward compatibility. :-)
@Dessamator:
One solution to punctuation in file names would be to just require the use of the [[File:]] tag (with brackets) like it is already required for tabber. But you also have the same problem with my-caption and my-tab-label—they might contain punctuation too.
I am happy to report that it appears the link bug that I noted above has been fixed. This demo page is now displaying links in the table inside the tabber at the bottom of the infobox.
THANKS Wikia!
I believe it is true that galleries only work with images. However, I have not been able to get anything other than an image to display in a tabber passed as an argument to <image> inside a Portable Infobox. I tried plain text and in-line templates, just to see. It is expecting images and videos only.
But good news! It appears they have fixed the link problem when tables are used inside tabbers inside a PI. This demo page is now working! (The links in the tabber at the very bottom of the infobox were missing, and now they are being rendered.)
Tabbers passed as arguments to regular <data> fields seem to work fine.
Good catch! I gave it a try, but to no avail. The only way it worked was to remove the &. My steps:
Here is a set of CSS selectors that will make a <tabber> used in the <image> tag of a Portable Infobox look like the regular tabber. As far as I know, the PI tabber feature does not work in monobook, so I could not test it. No warranty is expressed or implied. Use at your own risk :-)
.pi-image-collection { margin-top: 0.5em; text-align: center; } ul.pi-image-collection-tabs { border-bottom: 1px solid #778; font: bold 12px Verdana,sans-serif; list-style: none outside none; margin: 0 0 2px; overflow: visible; padding: 0 0 4px; text-align: center; } ul.pi-image-collection-tabs li.current { background: none repeat scroll 0 0 #FFF; border-bottom: 1px solid #FFF; font-weight: bold; } ul.pi-image-collection-tabs li.current:hover { background-color: #FFF; border-bottom: 1px solid white; } ul.pi-image-collection-tabs li { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; display: inline; line-height: normal; list-style: none outside none; background: none repeat scroll 0 0 #DDE; border-color: #778 #778 -moz-use-text-color; border-image: none; border-style: solid solid none; border-width: 1px; color: #448; margin: 0 0 0 3px; padding: 3px 0.5em; text-decoration: none; } ul.pi-image-collection-tabs li:hover { background: none repeat scroll 0 0 #AAE; border-color: #227; color: #000; } .pi-tab-link.pi-item-spacing { padding: 3px 5px 4px; }