Inserting ad in the header

PeterJITG

Hey guys,

I can't for the life of me figure out how to place a universal ad in the header of the forum, right below the "Welcome" message and thread titles (if on a thread page). Like this:
https://www.dropbox.com/s/y3jjbbamtk33zhl/Ad.png?dl=0

I figured out how to add it ABOVE the welcome message/thread titles, but not below.

Any help would be greatly appreciated.

-Peter

Blueh

PeterJITG something like this? : https://discuss.flarum.org/d/4785-flagrow-ads-bombarding-your-users-with-ads-everywhere-if-you-want

PeterJITG

Not quite. It allows for placements in other areas, except where I need it :/

0E800

PeterJITG

Think you should try messing around with:

https://github.com/flagrow/ads/blob/master/js/forum/dist/extension.js

System.register('flagrow/ads/addAdUnderHeader', ['flarum/extend', 'flarum/components/HeaderPrimary'], function (_export, _context) {
    "use strict";
    var extend, HeaderPrimary;
    _export('default', function () {
        extend(HeaderPrimary.prototype, 'config', function (isInitialized, context) {

            if (isInitialized) {
                return;
            }

            if (document.getElementsByClassName('Flagrow-Ads-under-header').length) {
                return;
            }

            var advertisement = app.forum.attribute('flagrow.ads.under-header');

            if (advertisement) {

                var appElement = document.getElementsByClassName('App-content')[0];

                var adsElement = document.createElement('div');

                adsElement.className = 'Flagrow-Ads-under-header';
                adsElement.innerHTML = advertisement;

                appElement.parentNode.insertBefore(adsElement, appElement);
            }
        });
    });

    return {
        setters: [function (_flarumExtend) {
            extend = _flarumExtend.extend;
        }, function (_flarumComponentsHeaderPrimary) {
            HeaderPrimary = _flarumComponentsHeaderPrimary.default;
        }],
        execute: function () {}
    };
});;

https://github.com/flagrow/ads/blob/master/js/forum/src/addAdUnderHeader.js

import { extend } from 'flarum/extend';
import HeaderPrimary from 'flarum/components/HeaderPrimary';

export default function () {
    extend(HeaderPrimary.prototype, 'config', (isInitialized, context) => {

        if (isInitialized) { return; }

        if (document.getElementsByClassName('Flagrow-Ads-under-header').length) {
            return;
        }

        const advertisement = app.forum.attribute('flagrow.ads.under-header');

        if (advertisement) {

            var appElement = document.getElementsByClassName('App-content')[0];

            var adsElement = document.createElement('div');

            adsElement.className = 'Flagrow-Ads-under-header';
            adsElement.innerHTML = advertisement;

            appElement.parentNode.insertBefore(adsElement, appElement);
        }
    });
}

I am no programmer but I would try changing the insertBefore to insertAfter.
Or possibly change:
var appElement = document.getElementsByClassName('App-content')[0];
To:
var appElement = document.getElementsByClassName('App-header')[0];
Other class names to try:
Header-title
Header-primary
Hero
WelcomeHero
Maybe when the devs have more time, they can add your request.

Its a good learning example for sure, to try to manipulate the code to achieve what you want.