+1-888-365-2779
Try Now
More in this section

Forums / Project Feather / Bootstrap Glyph icons not displaying

Bootstrap Glyph icons not displaying

7 posts, 0 answered
  1. Samir Vaidya
    Samir Vaidya avatar
    261 posts
    Registered:
    05 Feb 2005
    24 Apr
    Link to this post

    I am using Sitefinity Feather to use a Bootstrap carousel as outlined in this article: http://www.w3schools.com/bootstrap/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.

  2. Velizar Bishurov
    Velizar Bishurov avatar
    143 posts
    Registered:
    01 Dec 2016
    27 Apr
    Link to this post
    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
     
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Sitefinity CMS Ideas&Feedback Portal and vote to affect the priority of the items
     
  3. Samir Vaidya
    Samir Vaidya avatar
    261 posts
    Registered:
    05 Feb 2005
    27 Apr
    Link to this post
    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?
  4. Velizar Bishurov
    Velizar Bishurov avatar
    143 posts
    Registered:
    01 Dec 2016
    03 May
    Link to this post
    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
     
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Sitefinity CMS Ideas&Feedback Portal and vote to affect the priority of the items
     
  5. Jacques
    Jacques avatar
    427 posts
    Registered:
    28 Jun 2007
    01 Nov in reply to Velizar Bishurov
    Link to this post
    @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? 
  6. Jacques
    Jacques avatar
    427 posts
    Registered:
    28 Jun 2007
    01 Nov in reply to Velizar Bishurov
    Link to this post

    @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: 

    http://myProject/ResourcePackages/Bootstrap/assets/dist/css/sitefinity.bootstrap.min.css

    and the path to the font file is as follows: 

    http://myProject/ResourcePackages/Bootstrap/assets/dist/fonts/bootstrap/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? 

  7. Jacques
    Jacques avatar
    427 posts
    Registered:
    28 Jun 2007
    02 Nov
    Link to this post
    Anybody:? 
7 posts, 0 answered