FAQ Database Discussion Community


OpenNTF ApplicationLayout and GlyphIcons : how to use?

twitter-bootstrap,xpages,glyphicons
I'm using the last ExtensionLibrary (v11), theme 'bootstrap3.2.0' and ApplicationLayout control with 'bootstrapResponsiveConfiguration'; I'm trying to use GlyphIcons in ApplicationLinks without success: Is it possible? Can someone provide an example? This is part of code I try (no error returned): <xe:this.configuration> <xe:bootstrapResponsiveConfiguration productLogo="/abc.gif" productLogoHeight="38px" titleBarName="#{javascript:sessionScope.ssCurrentApplication}" placeBarName="Place Bar" footer="false" legal="false"...

How can i add icon to bootstrap dropdown

html,twitter-bootstrap,css3,glyphicons
I have this code <div class="btn-group" dropdown> <button type="button" class="btn btn-danger">Action</button> <button type="button" class="btn btn-danger dropdown-toggle" dropdown-toggle> <span class="caret"></span> <span class="sr-only">Split button!</span> </button> <ul class="dropdown-menu" role="menu"> <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else...

How to remove shadow from glyphicons in bootstrap carousel

twitter-bootstrap,glyphicons
I have a bootstrap carousel on my site. The right and left arrow glyphicons which come with it are surrounded by a square grey box of shading. I was wondering if someone could tell me how to remove the shading so I just have the arrows. Do I have to...

Fix bootstrap differences betwen GlyphIcon and FontAwesome

twitter-bootstrap,font-awesome,glyphicons
I currently trying to create a nice navbar menu using bootstrap web framework and I have to use both font family icons GlyphIcon and FontAwesome but my problem is that the icons are not created with the same size and I have differences between FontAwesome and GlyphIcons, does someone know...

Some bootstrap glyphicons not loading

wordpress,twitter-bootstrap,sass,glyphicons,bootstrap-sass
I have a WordPress theme that I'm building with Bootstrap Sass source. The styles are working, but most of the glyphicons aren't (only asterisk and plus). I'm compiling my Bootstrap to the style.css and relative to that, there is a folder called fonts which holds the glyphicons (I set the...

Some bootstrap3 glyphicons not work

twitter-bootstrap-3,glyphicons
when I use "pushpin": <span class="glyphicon glyphicon-pushpin"></span> It works fine. but when I want use "glyphicon-menu-right" it doesn't work: <span class="glyphicon glyphicon-menu-right"></span> Is there any solution?...

Get glyphicons thinner

css,bootstrap,glyphicons
Everyone! I'm trying to make glyphicons thinner, like this Now I get this view of icon Is there any solution to make it thinner? I tried to chnge font-size and font-weight, but it didn't help. What eles can I do?...

Bootstrap glyphicon-menu-hamburger not showing

css,twitter-bootstrap,icons,glyphicons
Here is clearly defined bootstrap icon for hamburger menu: http://getbootstrap.com/components/#glyphicons-glyphs If I use it in my html this icon is not showing, but others icon are: <button class="btn btn-default" type="button"> <span class="glyphicon glyphicon-menu-hamburger" aria-hidden="true"></span> </button> Why is that? ...

How to make an tag an HREF on Bootstrap3?

html,css,twitter-bootstrap-3,glyphicons,search-box
I'm working with Bootstrap version 3.3.4 and I'm trying to make a search form, however, in order to make my search glyphicon get inside my search bar I need to use an tag , here is the code I'm currently using: <form id="searchform" method="get" action="/search/" class="navbar-form navbar-right"> <div> <div class="right-inner-addon>...

PHP Concatenate Bootstrap Glyphicons

php,twitter-bootstrap,glyphicons
I have a php concatenate problem for echoing Bootstrap Glyphicon. The HTML for Bootstrap Glyphicon is: <span class="glyphicon glyphicon-map-marker" aria-hidden="true"></span> I want to concatenate for PHP echo so I tried this, but doesn't work: echo "<p>" . "<span class=" . "glyphicon glyphicon-map-marker" . "aria-hidden=" . "true" . ">" . "</span>"...

Glyphicons changing size

css,twitter-bootstrap-3,glyphicons
I'm trying to arrange some glyphicons on a webpage that will eventually contain links when clicked. I want them to change colour when the cursor touches them but cannot figure out why in my current attempt they all seem to change size so much. (I don't mind them changing size...

Bootstrap: How to make glyphicons appear only in navbar collapse?

twitter-bootstrap,navbar,glyphicons
Like I mentioned in the title of the question, I want the glyphicons for my list items in the navbar to appear only in mobile devices i.e. when navbar is collapsed. I don't want them to be visible in the md, lg.. devices with those list items. Is there any...

Using GLYPHICONS's free pngs with classes

css,twitter-bootstrap,fonts,glyphicons
Glyphicons allows free use of its halflings icon set via Twitter Bootstrap: Bootstrap comes with two files (a .woff and a .svg) that are loaded as font files by the browser. Glyphicons also allows you to download PNGs of all the rest of its icons. Is there a way to...

Bootstrap Glypicons doesn't show on second hosting

twitter-bootstrap,glyphicons
I am using newest Bootstrap 3.3.2 and I put some of Glyhicons into website. On testing hosting everything is fine, glyphicons showing right, but when I copied exact page files to another hosting they just doesn't display. Just empty quare. Do you have any ideas why is this? Test: http://gfp_white_label.lumi-design.sk/...

AngularJS: Custom font icons

css,angularjs,font-face,font-awesome,glyphicons
As fonts are better than images to show icons in different devices, I want to make my custom font icon library like "Font Awesome", in my AngularJS project. Are there any way to do that? I created a font in .ttf and .svg with my icons, and the result is...

Fixed Width Glyphicons

css,twitter-bootstrap,glyphicons
I am working on a web site that uses Bootstrap. I am only using the included Glyphicons pack. There are three important features from Font Awesome that I need though. Fixed Width Icons Fa-Spin The rotated and flipped options These three features can be seen in the examples. My question...

Which element to use for font icons in bootstrap navbar

twitter-bootstrap,twitter-bootstrap-3,font-awesome,glyphicons,font-awesome-4.0.0
Bootstrap 3 navbar uses glyphicons and Font Awesome icons as shown in html below. Bootstrap manual recommends to use span element: <span class="fa fa-pencil-square-o" aria-hidden="true"></span> FontAwesome web page recommends to use i element: <i class="fa fa-pencil-square-o" aria-hidden="true"></i> Using i element makes icon bigger than using span . Bigger looks better....

Including Bootstrap Glyphicons In Express

node.js,twitter-bootstrap,express,glyphicons
I'm trying to use glyphicons (via bootstrap) in my Express app. The problem is when I'm serving my static files, the glyphicons aren't included. This is my directory (created by grunt): Build fonts glyphicons-halflings.eot ... js scripts.js stylesheets styles.css Here is my app.js code: app.use('/build/', express.static(path.join(__dirname, 'build/js'))); app.use('/build/', express.static(path.join(__dirname, 'build/stylesheets')));...

Bootstrap Glyphicons not appearing for carousel

jquery,css,twitter-bootstrap,glyphicons
For my carousel, the bootstrap glyphicons are not showing up. I made sure that I have the fonts folder. You can see a test version of the site here (redacted). Interestingly enough, the arrows appear only when I do a live preview with my web IDE (Brackets by Adobe)....

how to add 'glyphicon glyphicon-user' and 'glyphicon glyphicon log-in' in this code?

ruby-on-rails,glyphicons
My code which is coming wrong: This is what i have tried but it is coming wrong <ul class="nav navbar-nav navbar-right"> <li> <span class="glyphicon glyphicon-user"> <%= link_to 'SignUp', {:controller =>'users', :action => 'new'} %></span> </li> <li> <span class="glyphicon-log-in"> <%= link_to 'LogIn', {:controller =>'sessions', :action => 'new'} %></span> </li> </ul> ...

Bootstrap Glyphicons not rendering using local Bootstrap version

css,twitter-bootstrap-3,glyphicons
I am using bootstrap in django and it works perfectly for all other bootstrap classes except icon classes like: class="glyphicon glyphicon-download-alt" Snapshot with error at right bottom: Snapshot when bootstrap.min.css file included: On doing inspect element it contain all glyphicons its snapshot is- It only works if I link http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css...

Missing fonts/glyphicons-halflings-regular.* when upgrading angular-bootstrap

angularjs,bootstrap,glyphicons,angular-bootstrap
I am using Yeoman and the cg-angular generator to scaffold an angular app. This was initially working fine, but I recently upgraded angular-bootstrap from 0.10 to 0.11 to get hold of a new feature regarding modal sizes. After doing this I noticed that I get the following errors in the...

Add glyphicon to headings

css,twitter-bootstrap,twitter-bootstrap-3,glyphicons
Like in this answer I'm trying to add icon to h3 tag. Here is a result: <link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css" rel="stylesheet"/> <link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/> <script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <h1>Play it! <span class="glyphicon glyphicon-play text-primary"/></h1> Also jsfiddle available. But inside h3 tag the icon...