-
Posts
-
Hello
On previous sites I have used this code …
/* CT Tick Box List */ ul.list { list-style-type: none !important; list-style: none !important; position:relative; display:block; left: -15px; list-style-position: outside; width:100%; padding-bottom:15px; } .list li { list-style-type: none !important; list-style: none !important; position: relative; padding-left: 5px; margin-bottom: 10px } .list li:before { position: absolute; top: 0; left: -15px; background-color: #FFFFFF; font-family: FontAwesome; content: "\f058"; color: #007ab6; }I have pasted the code in my Child Stylesheet.
Then in the text area on a page I use this …
<ul class="list"> <li class="list">Bullet 1.</li> <li class="list">Bullet 2.</li> <li class="list">Bullet 2.</li> </ul>But in Enfold it is just displaying as the normal black bullet point.
I have tried several suggestions on the support forum but none of them work when pasting to my chile stylesheet.
Hi richardelectrix!
Have you imported FontAwesome? If not, please refer to my post here – https://kriesi.at/support/topic/importing-icon-from-font-awesome/#post-414749 and import it.
Best regards,
YigitHey!
Can you please post the link to your page where you have your list? Temporary admin logins would help if you do not mind posting :)
Cheers!
YigitI will set that up for you soon.
I have added the line of code to the functions but I can’t see that it has made any difference.
Hey!
there is an error message appearing in Chrome console:
Font from origin ‘http://dev2.electrixinternational.com’ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://dev2.electrixinternational.com.’ is therefore not allowed access.
Can you show this message to your host please? I think they can fix it for you.
Best regards,
AndyHi, do you think I have everything set up right? (except for the error)
Is there a more elegant way of doing the Unordered Bullet Lists in Enfold?
Hi
I have followed the HTaccess instructions here … http://zinoui.com/blog/cross-origin-resource-sharing
I have added the following to my htaccess file.
Header set Access-Control-Allow-Origin "*"I still dont see any bullet points displaying correctly.
Hello
I have followed those instructions and my bullet points still look like normal bullet points.
This is partially fixed, however it isnt display the ‘check/tick’ icon as expected …
Hey!
Do you mean icon? If so, please make sure that “content: “\f058″;” this is the correct one you should use for your icon.
Regards,
YigitHi
That is the correct Font Awesome icon …
http://fortawesome.github.io/Font-Awesome/icon/check-circle/
Hi
Do you have an update for this?
I am not sure the CSS is correct to pull in the font awesome icon.
As an alternative I have imported the icons from fontello. How can I reference that in my UL?
Another issue I have encountered is most of the icons I have imported dont display correctly …
Hello
Can anyone assist with this?
This is now my code …
ul.list { list-style-type: none !important; list-style: none !important; position:relative; display:block; left: 0px; list-style-position: outside; width:100%; padding-bottom:15px; } .list li { list-style-type: none !important; list-style: none !important; position: relative; padding-left: 5px; margin-bottom: 10px; } .list li:before { position: absolute; top: 0; left: -15px; background-color: #FFFFFF; font-family:'Fontello'; content:"ue822"; color: #007ab6; } /* CT END Tick Box List */UE822 is the Fontello symbol that I imported with the icon management tool.
Hi guys
Does anyone have any suggestions for this?
Rather than using Font Awesome, I have imported the font awesome icons from Fontello.
I still cant get them to show in a bullet list.
Are there any instructions to get the standard Fontello icons to work as Bullet Points in a
- ?
Hey!
we are lots of different moderators living in different timezones, so we can’t provide you all our IP addresses to you. Let us know when we can access your backend to have a deeper look.
In the meanwhile check out this links:
http://astronautweb.co/snippet/font-awesome/
http://stackoverflow.com/questions/20782368/use-font-awesome-icon-as-css-contenthttp://kriesi.at/documentation/enfold/adding-your-own-icon-fonts/
http://kriesi.at/documentation/enfold/change-icon-used-for-standard-theme-elements/Regards,
AndyHi
Unfortunately without an IP address we wont be able to let you access the backend.
This is a security policy maintained by our hosts.
None of the links seem to help.
Basically, I have imported the font awesome icons from Fontello (so I am not linking in any way directly to any font awesome icons).
I want to use Fontello Charcode \ue822 (the number given to the particular icon when I imported it) as the bullet point on my bullet lists.
Hi
I added some code to the functions php for the child as suggested above.
I have also imported the Fontello Afont Awesome icons but still can’t get them to work on ULs
- The topic ‘Using Font Awesome on a Unordered Bullet List’ is closed to new replies.