Page 1 of 1

Fontawesome as menu icons

Posted: Wed Mar 14, 2018 6:42 pm
by Tata
I wonder how is it possible/what and where shall be modified to have the font icons within the page title in menu.
Is is simple to have the in page heading. But generated menu links do not show them.
If this would be possible, my intention is to use one more option for viewtopic.php?f=12&t=13548&start=20#p65827.

Re: Fontawesome as menu icons

Posted: Wed Mar 14, 2018 8:08 pm
by lck
Tata wrote:
Wed Mar 14, 2018 6:42 pm
I wonder how is it possible/what and where shall be modified to have the font icons within the page title in menu.
One way is per css:

Code: Select all

.menulevel1 li:nth-child(n) a:before,
.menulevel1 li:nth-child(n) span:before {
	color: #fff;
	display: block;
	font: 3em FontAwesome;
	padding: 0;
	position: relative;
	text-align: center;
}
.menulevel1 li:nth-child(1) a:before,
.menulevel1 li:nth-child(1) span:before {
	content: "\f015";	
}

.menulevel1 li:nth-child(2) a:before,
.menulevel1 li:nth-child(2) span:before {
	content: "\f1b9";
}
.menulevel1 li:nth-child(3) a:before,
.menulevel1 li:nth-child(3) span:before {
	content: "\f1f8";
}

/* and so on ... */
Another way is Christophs Toxic_XH

Re: Fontawesome as menu icons

Posted: Wed Mar 14, 2018 8:30 pm
by Tata
It is not what I mean. Better explanation is here.
The icons in headings are fine. They are not taken into the menu item.

Re: Fontawesome as menu icons

Posted: Wed Mar 14, 2018 10:04 pm
by cmb
Tata wrote:
Wed Mar 14, 2018 8:30 pm
It is not what I mean. Better explanation is here.
The icons in headings are fine. They are not taken into the menu item.
Well, all HTML tags are stripped from the page headings (for the menu, and other purposes as well), so these FA icons will be lost. You could insert the FA icons with the respective character code instead of <span>s, but even that would get rather tricky (if possible at all).

Re: Fontawesome as menu icons

Posted: Wed Mar 14, 2018 10:35 pm
by Tata
I assume it would require modification in one of core functions. Maybe with some option in metaconfig/config?
I also tried to find a PHP function for getting this icon from the page title to use it in the modified expandcontract plugin for generation of a clickable icon instead of the image icon I added to the plugin. But didn't find the way how to extract the <span class="fa ..."></span> or <i>...</i>.
cmb wrote:You could insert the FA icons with the respective character code instead of <span>s, but even that would get rather tricky (if possible at all).
I'll will try it on weekend.

Re: Fontawesome as menu icons

Posted: Thu Mar 15, 2018 6:20 pm
by cmb
Tata wrote:
Wed Mar 14, 2018 10:35 pm
I also tried to find a PHP function for getting this icon from the page title to use it in the modified expandcontract plugin for generation of a clickable icon instead of the image icon I added to the plugin. But didn't find the way how to extract the <span class="fa ..."></span> or <i>...</i>.
That's somewhat tricky, since you'd have to parse the content of the page yourself. Perhaps the following will already do:

Code: Select all

preg_match_all('/class="fa (.*?)"/', $c[$s], $matches);
var_dump($matches[1]);