add new icons to icon box

[abowe1978Participant]

Can i add new icons to icon box?
Can you show me the way to do this?

Thank u

[JohnnyParticipant]

hi, add icon from backend here: left menu ‘bee’/layout settings/ social medias section, click plus icon to add,
Thank you

[agencizParticipant]

hello,

i want to add custom icon in the choice, not social icon, but it’s a font,
can i add some ?

best

[JohnnyParticipant]

hi, as icons limited by the font lib when the original production, so what icons you wanted maybe not in the lib. but there still have some options not included in the iconbox UI by this theme default, you can added them manually:
1. open file functions/pagebuilder/css/style.css, find class name begin with ‘s-‘ ‘p-‘ ‘pt-‘
2. open file functions/pagebuilder/pagebuilder-modules.php and find this:

array(
		'id' => 'icon',
		'item' => array(
			'm-check',
			'm-close',
			'm-play1',...

add those class name you find in step 1 at the end of this array like this:

...'m-forum-top',
            'p-play',...
		)

Best

[agencizParticipant]

hello,

i want to use my icon homemade, can i ?
and how insert it ?

best

[agencizParticipant]

i make my own font, i placed the font and the css in the page builder,
my icone is display in the backend but not in the frontend.

Can you help me ?

Best

[JohnnyParticipant]

hi, please give me more details about this, where you added the font and its styles? page url you expected to show the icon? I will examine this for you later,
Thank you

[agencizParticipant]

hello,

i made my font with icomoon:
so i have the fonts and the css generate :

the css:
@font-face {
font-family: ‘icomoon’;
src:url(‘fonts/icomoon.eot?-nddrno’);
src:url(‘fonts/icomoon.eot?#iefix-nddrno’) format(’embedded-opentype’),
url(‘fonts/icomoon.woff?-nddrno’) format(‘woff’),
url(‘fonts/icomoon.ttf?-nddrno’) format(‘truetype’),
url(‘fonts/icomoon.svg?-nddrno#icomoon’) format(‘svg’);
font-weight: normal;
font-style: normal;
}

[class^=”icon-“], [class*=” icon-“] {
font-family: ‘icomoon’;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;

/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.icon-rotisserie:before {
content: “\e604”;
}
.icon-materiel-alimentaire:before {
content: “\e605”;
}
.icon-cremerie:before {
content: “\e606”;
}

i put the font folder with yours in the page-builder folder (with “font” and “font-update”).

After i put the css below here ( with the other fontface):
functions/pagebuilder/css/style.css, find class name begin with ‘s-’ ‘p-’ ‘pt-’

After i put the class “icon-rotisserie” in functions/pagebuilder/pagebuilder-modules.php with other icon classes.

Then i go to the backend on a page and i select icon box with page builder.
=> i can see my own icon => i select it => when i m come back to the front office, the icon is not display.

maybe you know how to use and insert icomoon font in your icon box…

best

[JohnnyParticipant]

Hi, paste your page url here please.
Thank you

[agencizParticipant]

This reply has been marked as private.

[agencizParticipant]

This reply has been marked as private.

[JohnnyParticipant]

hi, please copy new styles to bee/styles/pagebuild.css, and make sure the font face src with right path.
Best

[agencizParticipant]

yes ! that’s it
Big Up !!!!!

best

[Author]

Posts