Bootstrap Glyph icons not displaying
I am using Sitefinity Feather to use a Bootstrap carousel as outlined in this article: www.w3schools.com/.../bootstrap_carousel.asp
However, I have noticed a very odd behavior with using the left and right glyph icons as part of the Bootstrap carousel.
When I am editing my content block in the Sitefinity Content Editor through the Administrative backend interface, I can see the glyph icons clearly visible.
However, as soon as I published my page and view it on the Live site, the Bootstrap glyph icons are no longer visible!
Please advise as to how to resolve this problem.
Thanks.
Hi,
This behavior can be observed when the Feather content block is used on a Hybrid page. The reason is that resources from the Feather Resource Packages are not automatically loaded on hybrid pages.
Please try placing the widget on a page based on the Bootstrap template.
Regards,
Velizar Bishurov
Telerik
I am directly using an MVC Layout in my Boostrap MVC Layouts directory, so is this still considered a Hybrid page or should this already be a pure MVC page?
Hello,
When you have a layout file in the Mvc/Views/Layouts directory Sitefinity automatically creates a page template from that file. This page template is in pure MVC mode.
However if you later create another template, which is based on the automatically created one, you have the option to specify whether the template is MVC or Hybrid (in the Advanced Settings expander). If you have done that and have not explicitly specified that the template is MVC only there then the template is in Hybrid mode as this is the option selected by default.
The easiest way to check in what mode the template is is to check whether you can drag WebForms widgets on it. For example if you can drag both the WebForms News widget and the MVC News widget then the template is hybrid. If you can only drag the MVC widget then the template is in pure MVC mode.
Regards,
Velizar Bishurov
Telerik
@Velizar - If you have a MVC only template but your custom widgets are built in ascx files you can still drop them onto the page/template. Does this change the template from MVC only to hybrid or not?
@Velizar - I'm experiencing an issue where the glyphicons are not showing but looking at the sitefinity.bootstrap.min.css file I can see a reference to the font file, but it's not being downloaded to the browser even though the path seems to be right.
In Firebug I switch to the Net > Fonts tab and then force refresh the page. Glyphicons Halflings is never downloaded but the reference to it is there:
@font-face
font-family
:
"Glyphicons Halflings"
;
src
:
url
(
"../fonts/bootstrap/glyphicons-halflings-regular.eot?#iefix"
)
format
(
"embedded-opentype"
),
url
(
"../fonts/bootstrap/glyphicons-halflings-regular.woff2"
)
format
(
"woff2"
),
url
(
"../fonts/bootstrap/glyphicons-halflings-regular.woff"
)
format
(
"woff"
),
url
(
"../fonts/bootstrap/glyphicons-halflings-regular.ttf"
)
format
(
"truetype"
),
url
(
"../fonts/bootstrap/glyphicons-halflings-regular.svg#glyphicons_halflingsregular"
)
format
(
"svg"
);
There are no web server exceptions in terms of not being able to load the file so I thought that ruled out mimeMaps potentially blocking the content.
The sitefinity.bootstrap.min.css file path is as follows:
myProject/.../sitefinity.bootstrap.min.css
and the path to the font file is as follows:
myProject/.../glyphicons-halflings-regular.ttf
Looking at the @font-face code above you can see the paths are actually correct.
Note: If I put those URLs directly into the browser it works. The css loads, the font file downloads.
Any advice?
Anybody:?