• Login
  • Register

DNN Forums

Ask questions about your website to get help learning DNN and help resolve issues.

Adding top icon to xcillion

You are not authorized to post a reply.
Sort:


Basic Member


Posts:94
Basic Member

    i am using the xcillion theme on a page for which i would like to add an icon to the top action or menu bar. i am using the out-of-the-box version where it shows small icons at the top of the page for Check Messages, Check Notifications, User, Avatar, Logout, Search Icon. somewhere in there i would like to add a shopping cart icon, and then link it to the shopping cart summary module which in this case is for revindex storefront 17.2. dnn 9.8.1.

    does anyone know how to do this?



    Veteran Member


    Posts:980
    Veteran Member

      The icons that you mention are part of the Login skin object.

      If you want to modify the skin, your best bet is to make a copy of the Xcillion folder and rename it. You could call it Xcillion-Me and put it in the /portals/_default/skins folder.

      Then you need to modify Home.ascx, Inner.ascx, and Admin.ascx files.

      All of those files have a similar structure. If you want to mimic the behavior of the existing skin, add a div just under the div with ID of login. Something like this:

      [div id="mystuff' class="pull-right"]
      add your html here
      [/div]

      if you want to do this often, and actually have one thing that works on all of the skin files, create a skin object for this (it's fairly easy) or add in include at that point (even easier).
      Joe Craig
      DNN MVP
      Patapsco Research Group


      Basic Member


      Posts:94
      Basic Member

        Posted By Joe Craig on 02 Mar 2021 12:48 PM
        The icons that you mention are part of the Login skin object.

        If you want to modify the skin, your best bet is to make a copy of the Xcillion folder and rename it. You could call it Xcillion-Me and put it in the /portals/_default/skins folder.

        Then you need to modify Home.ascx, Inner.ascx, and Admin.ascx files.

        All of those files have a similar structure. If you want to mimic the behavior of the existing skin, add a div just under the div with ID of login. Something like this:

        [div id="mystuff' class="pull-right"]
        add your html here
        [/div]

        if you want to do this often, and actually have one thing that works on all of the skin files, create a skin object for this (it's fairly easy) or add in include at that point (even easier).

        thank you - that got me going. it involved quite a bit more work than i originally imagined because the theme login elements are processed on the server whereas mine are strictly handled in client side html and css. so to style it properly, i dug around in the developer tools to reverse engineer a lot of the css settings and html.

        i could not find a compatible shopping cart icon, but there was one in the main Images folder which is adequate.

        more elaborate implementations would require javascript with server side integrations which is more trouble than i need for the moment.

        and of course i need to save these changes for the next dnn upgrade which will probably overwrite them. i saved a copy of the original theme and then modified the one in place. maybe it back asswards but i can only do so many new tricks at once.

         

        You are not authorized to post a reply.

        These Forums are dedicated to discussion of DNN Platform.

        For the benefit of the community and to protect the integrity of the ecosystem, please observe the following posting guidelines:

        1. No Advertising. This includes promotion of commercial and non-commercial products or services which are not directly related to DNN.
        2. No vendor trolling / poaching. If someone posts about a vendor issue, allow the vendor or other customers to respond. Any post that looks like trolling / poaching will be removed.
        3. Discussion or promotion of DNN Platform product releases under a different brand name are strictly prohibited.
        4. No Flaming or Trolling.
        5. No Profanity, Racism, or Prejudice.
        6. Site Moderators have the final word on approving / removing a thread or post or comment.
        7. English language posting only, please.

        Would you like to help us?

        Awesome! Simply post in the forums using the link below and we'll get you started.

        Get Involved