Comrade:CriticalResist/sandbox/Hyperlink buttons on headings documentation: Difference between revisions
More languages
More actions
(Created page with "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:<bloc...") Tag: Visual edit |
No edit summary Tag: Visual edit |
||
Line 40: | Line 40: | ||
</blockquote>Pretty self-explanatory, the only catch is this:<blockquote> /*$('.section-heading .mw-headline, .section-subheading .mw-headline').each(function() {*/</blockquote>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. | </blockquote>Pretty self-explanatory, the only catch is this:<blockquote> /*$('.section-heading .mw-headline, .section-subheading .mw-headline').each(function() {*/</blockquote>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. | ||
== Known issues == | |||
* had to disable lvl1 headings because if you click on the icon, it collapses the section for some reason (the button should take priority over the collapsing) | |||
* If headings have the same name (such as Notes) it will take you to the first instance. Should be fixable easily by appending _2, _3 etc for each new instance which is what MediaWiki does. |
Latest revision as of 20:39, 24 September 2023
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.
Known issues[edit | edit source]
- had to disable lvl1 headings because if you click on the icon, it collapses the section for some reason (the button should take priority over the collapsing)
- If headings have the same name (such as Notes) it will take you to the first instance. Should be fixable easily by appending _2, _3 etc for each new instance which is what MediaWiki does.