Indaba2024Local_banner

[edit] This extension allows administrators to create and edit banner campaigns across multiple wikis. Documentation can be found at Help:CentralNotice.

Please add potential notices to the CentralNotice calendar and discuss potential changes with the project sponsor prior to making them. See also the CentralNotice usage guidelines and banner guidelines.

Current cache settings: Banners: 10min server, 0min client; Geo: 0min. Note: Campaigns are not cached - rather, banners assigned to campaigns are cached.

Testing: The Afar Wikipedia (aawiki) and many others have been closed, but are still live and can be targeted from CentralNotice campaigns. Alternately you can test on test.wikipedia.org but note that it runs a completely separate instance of CentralNotice.

Emergencies: Any urgent issue regarding any ongoing campaign or live banner should be reported to #wikimedia-fundraising^connect or jseddonwikimedia.org.

Building a banner? Need a template to use? Try templatev2!

Settings

Category

Banners of a specific category share tracking variables and group settings (e.g. hide cookies and impression counts). Category names can be magic words like {{{campaign}}} or {{{banner}}} which will be automatically expanded at display time. Values must be alphanumeric.

Display to

Logged in users

Anonymous users (remember to uncheck unless necessary)

Display on: (if you are setting a banner to appear on the mobile site, please test it there first)

(desktop) Desktop Computer

(android) Android OS

(iphone) All iPhone versions

(ipad) All devices identified as iPads but not iPhones

(unknown) Devices on the mobile site which are not iPhones, iPads, or Android - (Selector logic)

Mixins

Check each mixin that you want to be included during banner delivery. (See Banner mixins for more information.)

Edit banner

Warning: Loading external resources into a banner can compromise user privacy.

To create a localisable message, enclose a string in three curly brackets, e.g. {{{message_name}}}. To use a localisable message from another banner, include the banner name followed by a comma, then the message name, e.g., {{{banner_name,message_name}}}.

Magic words provided by banner mixins: {{{banner}}} and {{{campaign}}}

<!-- For guidance or help with this banner, contact Seddon (WMF) -->
<!-- This banners is set up to run to loggedin users only -->
<style>

/* Main banner container. Banner: background, border colour and width and adding a margin between banner and article header*/
.cnotice {
    position: relative;
    overflow: hidden;
    background: #f8f9fa;
    color: #202122;
    border: 1px solid #a2a9b1;
    border-radius: 2px;
    margin-bottom: 1em;
    cursor: pointer;
    font-weight: 500;
}

.cnotice a {
    color: inherit;
}
.cnotice a:hover {
    color: inherit;
    text-decoration: underline;
}

/* Sets the minimum banner height. If img + logo-container margins > height. Banner will be larger*/
#cnotice-main {
    display: table;
    width: 100%;
    height: 80px; /* need to set height for height 100% to work on elements within it */
}

/*MOBILE - Adjust mobile height of banner*/
body.skin-minerva #cnotice-main {
    height: 100px;
}

/*IMPORTANT - don't touch*/
.cnotice-message-container,
.cnotice-logo-container,
.cnotice-misc-container {
    display: table-cell;
    height: 100%;
    vertical-align: middle;
}

/* --- Main message --- */
.cnotice-message {
    position: relative;
    margin: 0;
    line-height: 1.2;
    padding: 5px 5px 5px 5px;
}

@media (min-width: 1200px) {
    .cnotice-message {
        padding: 15px 0px 11px 30px;
    }
}

body.rtl .cnotice-message {
    padding: 5px 5px 5px 5px;
}

.cnotice-message p {
    margin: 0;
    font-family: Arial, sans-serif;
    font-weight: bold;
    font-size: 100%;
    opacity: 1;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
}

@media (min-width: 1200px) {
    .cnotice-message p { font-size: 120%; }
}


/* --- Logo Image text --- */
.cnotice-logo-container {
    width: 10%;
}

body.rtl .cnotice-logo-container {
    padding: 0 .25em 0 .9em;
}

.cnotice-logo-container img {
    opacity: 1;
    display: block;
    margin-left: 15%;
    margin-top: 2px;
    margin-bottom: 1px;
}

/*Misc containter stuff starts here*/
.cnotice-misc-container {
    width: 10%;
    padding-right: 40px;
}

/*Detects and adjusts for mobile skin */
body.skin-minerva .cnotice-misc-container {
    padding-right: 10px;
}


/* --- Close Options --- */

#cnotice-toggle-box-options {
    display: table-cell;
    font-size: .8em;
    text-transform: uppercase;
    width: 38px;
    height: 38px;
    border-radius: 19px;
    vertical-align: middle;
}

#cnotice-toggle-box {
    cursor: pointer;
    position: absolute;
    top: 2px;
    right: 3px;
    z-index: 1;
    opacity: .8;
}

body.rtl #cnotice-toggle-box {
    left: 3px;
    right: unset;
}

#cnotice-toggle-box:hover { 
    opacity: 1;
}

#cnotice-toggle-icon{
    background: 
       linear-gradient(transparent,transparent),
       url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2220%22 height=%2220%22 viewBox=%220 0 20 20%22%3E%3Ctitle%3Eclose%3C/title%3E%3Cpath d=%22M4.34 2.93l12.73 12.73-1.41 1.41L2.93 4.35z%22/%3E%3Cpath d=%22M17.07 4.34L4.34 17.07l-1.41-1.41L15.66 2.93z%22/%3E%3C/svg%3E");
    height: 100%;
    width: 17px;
    min-width: 17px;
    min-height: 17px;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    opacity: 0.8;
}

#cnotice-toggle-icon:hover { 
    opacity: 1;
}

/* --- Full Banner Link --- */
.cnotice a.cnotice-full-banner-click {
    display: block;
    height: 100%;
    width: 100%;
    cursor: pointer;
    text-decoration: none;
}

.cnotice a.cnotice-full-banner-click:hover {
    text-decoration: underline;
}

.cnotice-button {
    display: inline-block;
    border: 2px solid #36c;
    border-radius: 2px;
    color: #fff;
    padding: 5px 5px;
    text-align: center;
    font-weight: bold;
    text-decoration: none;
    font-size: 14px;
    margin: 4px 2px;
    -moz-transition-duration: 100ms; /* Firefox */
    -webkit-transition-duration: 100ms; /* Safari */
    transition-duration: 100ms;
    cursor: pointer;
    z-index: 1;
    min-width: 80px;
}

@media (min-width: 1100px) {
    .cnotice-button {
        min-width: 110px;
        width: 25%;
        margin: auto;
    }
}

/* --- Buttons --- */
.cnotice a.cnotice-buttonlink {
    cursor: pointer;
    text-decoration: none;
    color: #000;
}

.cnotice a.cnotice-buttonlink:hover {
    color: #fff;
}

.cnotice-button1 {
    background-color: #36c;
    border-color: #36c;
    color: #fff;
}

.cnotice-button1:hover {
    background-color: #447ff5;
    border-color: #447ff5;
}

.cnotice-button1:active {
    background-color: #2a4b8d;
    border-color: #2a4b8d;
}

.rtl .cnotice-button1 {
    left: 23px;
    right: auto;
    margin-left: 20px;
}

#cnotice-translation-link {
    position: absolute;
    right: 65px;
    bottom: 0px;
    font-size: 0.8em;
    white-space: nowrap;
}

#cnotice-translation-link:hover {
    text-decoration: underline;
}

.rtl #cnotice-translation-link {
    text-align: left;
    left: 65px;
}

/* --- Dark mode --- */
html.skin-theme-clientpref-night .cnotice {
    color: #eaecf0;
    background: #202122;
    border-color: #72777d;
}
html.skin-theme-clientpref-night #cnotice-toggle-box {
    filter: invert(1);
}

@media (prefers-color-scheme: dark) {
    html.skin-theme-clientpref-os .cnotice {
        color: #eaecf0;
        background: #202122;
        border-color: #72777d;
    }
    html.skin-theme-clientpref-os #cnotice-toggle-box {
        filter: invert(1);
    }
}
</style>

<!-- N.B.! Make sure that dir="ltr" is explicitly written here, even if the text is written in a left-to-right language like English or Russian! Otherwise, it will be displayed incorrectly when the banners is shown in a wiki in an RTL language. If the banner is in an RTL language, change dir="ltr" to dir="rtl". -->
<div class="cnotice" id="{{{banner}}}" dir="ltr">
    <a class="cnotice-full-banner-click external text" href="//meta.wikimedia.org/wiki/Wikimedia_South_Africa/Local_Scholarships">
        <div id="cnotice-main">
            <div class="cnotice-logo-container">
                <img src="//upload.wikimedia.org/wikipedia/commons/5/59/Wiki_Indaba_2024_Logo.svg" alt="Banner logo" width="125px" height="125px">
            </div>
            <div class="cnotice-message-container">
                <div class="cnotice-message">
                    <!--
                    Make sure that the appropriate direction for the language is EXPLICITLY set in
                    the top <div> element! If it's English, Russian, Spanish, or any other
                    left-to-right language, it MUST say dir="ltr".
                    If it's in a right-to-left language like Arabic, Persian,
                    Urdu, or Hebrew, it MUST say dir="rtl".
                    -->
                    <p>Applications for Local Scholarships are extended and open until the 9th August 2024</p>
                </div>
            </div>
        </div>
    </a>
    <div id="cnotice-toggle-box">
        <a href="#" title="{{int:centralnotice-shared-hide}}" onclick="mw.centralNotice.hideBanner();return false;">
            <div id="cnotice-toggle-icon" href="#" title="{{int:centralnotice-shared-hide}}" onclick="mw.centralNotice.hideBanner();return false;"></div>
        </a>
    </div>
</div>

⧼centralnotice-form-actions⧽

Summary

Front-end cache

Purge front-end cache for the following language:

Removes banner content stored in the front-end cache for anonymous users, for the selected language. (Banners are not cached for logged-in users.)

Campaigns using this banner

Campaign name	Campaign type	Projects	Languages	Countries and regions	Starting (UTC)	Ending (UTC)	Enabled	Priority	Limit traffic	Locked	Archive
WikiIndaba 2024 Local Scholarships Campaign	Event	wikipedia	en	BW, LS, NA, SZ, ZA and ZW	2024-07-26 00:00	2024-08-09 21:59		normal