As I’m sure that many of you have noticed, the {{ Api
}} template, which is used in many places such as wikiHow:Admins
and wikiHow:Welcomers
, is broken in that the text does not start until it is right next to the bottom of the image. Kind of like how Microsoft Word is if you don’t wrap the text. This is because the template is coded with wikiTables, which do not work correctly with the new redesign.
Because of this, I have rewritten the template as a proposal in HTML so that it does display properly on the redesigned site now. This change has not been published as it is just a proposal.
With this change, instead of the template looking like this:
It looks like this:
This is how the template used to look before the redesign, and I think that it looks much better this way.
The template is basically the same, but I have made two changes. The first change is that the template no longer displays error messages when you view its template page. And I also added a line break at the end of the template so that there is white space between multiple listings. But everything else is as close to the same that I could make it. Also, the template has also been responsified so that it works correctly on desktops and mobile devices.
You can see the template and the code here
, and you can see what it looks like here
.
Anyways, I wanted to ask what all of you thought of this change. Do you like it? And do you have any input or changes that you think should be made?
6 Likes
Personally, I think it looks good! My only comment is that maybe the padding between the listings could be equalized - there’s more space above the template than below it. But that’s just me being a perfectionist, so you’re welcome to ignore that, baha.
(It also looks like “Contact” and “Typical wikiHow Activities” are missing a space between the colon and the input text, but that’s a five-second fix at most.)
Thanks for working your template magic, R2
6 Likes
JayneG
3
I’ll be very happy to see this update implemented! Thank you for taking the time and effort to figure out a fix for this, @R2_d2000
6 Likes
Looking good! I’d second the comment about the unequal padding, but otherwise, it looks great. Nice work, R2! Much appreciated
3 Likes
Eric
5
I support the enhancement and appreciate you taking the time to work on this!
5 Likes
XxVxX
6
I do agree with the fixes Alex mentioned, but other than that I definitely support this change! Thanks for noticing and fixing this R2!
5 Likes
Side question: Will WikiTables be fixed in the future? Or will they always be this broken.
I’d say be bold. So yes I support the change.
Okay, I’ve made some changes to fix the typos and formatting errors, and I fixed the padding to reduce the space between listings. You can see what the listings now look like here
.
Looks very nice! Definitely makes my eyes more comfortable… thanks for taking initiative and fixing this!
1 Like
JayneG
10
Looks great, R2! Thanks again!
Aasim: maybe? maybe not?
2 Likes
@R2_d2000
, The API template is used on the list of New Article Boosters at https://www.wikihow.com/wikiHow:New-Article-Boosters
and if the Author Summary isn’t complete, the line stops wherever the characters stop. But I did and do support this change! A few tweaks and this template might actually be something worthwhile keeping up-to-date as changes happen.
Also, is there a way to control the padding if there is a larger image or no image provided? There seems to be too much space in between larger images and some images extend above the top line of text on these list pages - making for uncomfortable viewing. (Help align the image with the top line of text, instead of just the reverse for those images that are bigger than the lines needed to provide space.)
1 Like
Hello, thanks for your feedback and questions. I’m busy right now and on Sunday, so I can’t write a long reply, but I’ll get back to you on Monday.
I just wanted to reply so that you know that I saw your comment.
Okay, I got some time now.
To answer your questions, the image padding cannot be changed since the image size is fixed at 125px (I would have used em, but MediaWiki does not support using em for image sizes. This size should be fine for mobile devices however, since it’s small enough. Also the padding is responsive along with the rest of the template, so it should not cause any issues.), so any image that is bigger than that will be squeezed down to that size. Also, because of the padding and the fixed size, the image will not extend above the text, nor will it extend below the text (even on mobile devices, and even if the author summary or any other section isn’t complete).
If no image is provided, then a message will display that says, " No image specified
". But that message still has padding, so it does not affect the rest of the template. It will also not display above the rest of the text.
I hope this answers your questions, and please feel free to reply to this comment if you have any additional questions.
It’s looking like this template has a lot of support. If anybody has any concerns or would like to request a change, please leave a comment below.
It looks like nobody opposes this change, so I will make update the template soon.
2 Likes
The {{Api}} template has now been updated. You can check out the new change for yourself on the welcomer/booster/admin pages. I have found out thought that the template can have trouble if the image has a lot of horizontal space compared to vertical space. So some users listings have been affected. I tried to test the template on most of the listings, but I could not test it on everything, and that was the only issue that I saw. Also, I do not see a way to fix this with the code. If your listing is affected, then you can fix it by following these steps:
Download the image, and then open it in Microsoft Paint
Click on the “Resize” button in the ribbon. Then, uncheck “Maintain aspect ratio”.Adjust the image, either by a percentage or by pixels, to give it more horizontal size compared to vertical size. You don’t have to crop the image if you don’t want to.
Reupload the image and change the image link in your listing.
If you cannot use Microsoft Paint, or need help, then you can send me a talk page message and I can resize it for you.
I apologize for this issue, like I said, I could not test it with every listing, and it is impossible to account for every situation when creating a template. If the community want to, then the template can be reset back, but I personally think that this is still an improvement over the older template.
If you’d like to try to fix it in the code, then you can edit it on User:R2_d2000/Sandbox
, and if you successfully fix the issue, then we can update the template.
2 Likes
Any plans to cleanup https://www.wikiHow.com/Template:MT
? Where its used, it seems to be unreaponsified and produced undesired results. https://www.wikiHow.com/wikiHow:Merge-Team
There’s also the CPE template - used on another team page, but it’s less problematic.
