More languages
More actions
In september 2023 I added some simple JavaScript to Common.js to add a hyperlink icon on the Citizen skin next to all headings and subheadings.
At this time however I disabled the code on level 1 headings because clicking on the hyperlink button somehow made the heading collapse as well (which is the normal behaviour from this skin, you can collapse level 1 headings, but not when you click on the button. Anyway, this is the only code needed:
(function($, mw) {
// Wait for the DOM to be ready
$(document).ready(function() {
// Loop through all the section headings and subheadings
/*$('.section-heading .mw-headline, .section-subheading .mw-headline').each(function() {*/
$('.section-subheading .mw-headline').each(function() {
// Get the section title
var sectionTitle = $(this).text();
// Replace spaces with underscores in the section title
var sectionTitleWithUnderscores = sectionTitle.replace(/ /g, '_');
// Create the HTML for the hyperlink button
var hyperlinkButton = '<a class="heading-hyperlink mw-editsection-visualeditor citizen-editsection-icon mw-ui-icon-wikimedia-link" href="/wiki/' + mw.config.get('wgPageName') + '#' + sectionTitleWithUnderscores + '" title="' + sectionTitle + '"></a>';
// Insert the button HTML after the section heading or subheading
$(this).after(hyperlinkButton);
});
});
})(jQuery, mediaWiki);
Pretty self-explanatory, the only catch is this:
/*$('.section-heading .mw-headline, .section-subheading .mw-headline').each(function() {*/
Which has been commented out. Once we figure out how to make it work with level 1 headings, you can bring back '.section-heading .mw-headline, in the function -- the line right below this commented out piece of code is the exact same just without the level 1 headings included.