Topic on Project:Support desk

How to initiate a frontend module in all webpages of MediaWiki?

7 comments • 10:17, 22 September 2021 2 years ago

7

182.232.50.87 (talkcontribs)

I have created a frontend module with HTML-CSS which is a "call now" sticky button.

index.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" href="./css/mobile_general_structure.css"></link>
		<link rel="stylesheet" href="./css/nonmobile_general_structure.css"></link>
	</head>
	<body>
		<div dir="rtl" class="camowb_main_box">
			<div class="camowb_phone_box">
				<a class="camowb_phone_link" href="https://wa.me/NUMBER">
					<img class="camowb_phone_icon" src="./images/whatsapp.svg"></img>
					<span class="camowb_phone_text">WhatsApp</span>
				</a>
			</div>
		</div>
	</body>
</html>

The module's files are located in a directory on top of the web application root (example.com/call_now).

What would be a reasonable way to initiate/boot the module in every MediaWiki webpage?

Reply 18:11, 17 September 2021 2 years ago

Bawolff (talkcontribs)

Its unclear what you are asking.maybe you want to make a custom Skin

Reply 05:25, 18 September 2021 2 years ago

49.230.4.89 (talkcontribs)

@Bawolff I will try to explain the core matter again better:

In my website directory example.com I have created a sub directory example.com/my_sub_directory in which I put a file index.html containing a "call now" button which I want to appear to in any webpage of my MediaWiki website.

Reply 07:36, 18 September 2021 2 years ago

Malyacko (talkcontribs)

Manual:$wgRawHtml?

Reply 11:24, 18 September 2021 2 years ago

49.230.6.165 (talkcontribs)

@Malyacko I already have wgRawHTML on, but I don't understand how it will help me to display the "call now" button module on every webpage of the website.

Reply 12:54, 18 September 2021 2 years ago

Jonathan3 (talkcontribs)

Add it to your skin or use MediaWiki:Sitenotice?

Reply 16:24, 18 September 2021 2 years ago

49.230.26.48 (talkcontribs)

@Jonathan3

I took another approach; due to my desire not to touch the MediaWiki template files I have created a file named index.js containing both the HTML, CSS and JavaScript and I load it with mw.loader.load("url here"); (the loading is done in Common.js).

index.js

newStyle = document.createElement("style");
newStyle.type = "text/css";
newStyle.innerHTML +=`
/*CSS_COMES_HERE*/
`;

document.head.appendChild(newStyle);

newHTML = document.querySelector("body");
newHTML.innerHTML +=`
<!-- HTML_COMES_HERE -->
`;

Reply 10:17, 22 September 2021 2 years ago

Reply to "How to initiate a frontend module in all webpages of MediaWiki?"