problem in changing admincp font vbulletin 5

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • habili
    Senior Member
    • Jan 2018
    • 253
    • 4.2.x

    problem in changing admincp font vbulletin 5

    hello dear friends, i want to change font of menus of admincp control panel. i create "font-face" in file "controlpanel.css" under the path "core/cpstyles/vBulletin_5_default" and change all "font-family" to my favorite font. after apply changes, my admincp login page font changed but when i loged into the admincp control panel, font did not change, i do know how to change admincp menu font, please help me solve that.
  • Wayne Luke
    vBulletin Technical Support Lead
    • Aug 2000
    • 73981

    #2
    You need to alter the font-family in each class you want to change. For instance the left navigation bar has these two classes:

    Code:
    .navtitle {
      background-color: #0086D3;
      height: 30px;
      border-top: 1px solid #7C8189;
      border-bottom: 1px solid #4F545B;
      font-family: Ubuntu, verdana, helvetica, arial, sans-serif;
      font-weight: bold;
      font-size: 15px;
      color: #F2F2F2;
      user-select: none;
      text-shadow: 2px 2px 2px rgba(150, 150, 150, 1);
    }
    
    .navgroup a {
      display: block;
      height: 28px;
      line-height: 28px;
      background: #E0E0E1;
      border-bottom: 1px solid #B1B1B1;
      text-decoration: none;
      font-family: Ubuntu, verdana, helvetica, arial, sans-serif;
      font-size: 13px;
      color: #000C1D;
    }
    You can see I've altered the font-family for each from the default. You'll need to go through the file and alter ever class with a font-family attribute to use your custom font.
    Translations provided by Google.

    Wayne Luke
    The Rabid Badger - a vBulletin Cloud demonstration site.
    vBulletin 5 API

    Comment

    • habili
      Senior Member
      • Jan 2018
      • 253
      • 4.2.x

      #3
      thanks for your reply. i changed the file "controlpanel.css" and edit all classes font-family. changes are as below, but still no effect :

      PHP Code:
      /*========================================================================*\
      || ###################################################################### ||
      || # vBulletin 5.5.2
      || # ------------------------------------------------------------------ # ||
      || # Copyright 2000-2019 MH Sub I, LLC dba vBulletin. All Rights Reserved.  # ||
      || # This file may not be redistributed in whole or significant part.   # ||
      || # ----------------- VBULLETIN IS NOT FREE SOFTWARE ----------------- # ||
      || # http://www.vbulletin.com | http://www.vbulletin.com/license.html   # ||
      || ###################################################################### ||
      \*========================================================================*/



      @font-face {
          
      font-familyiranyekan;
          
      font-stylenormal;
          
      font-weightbold;
          
      srcurl('http://linux-zone.org/forums/fonts/iranyekan/eot/iranyekanwebbold.eot');
          
      srcurl('http://linux-zone.org/forums/fonts/iranyekan/eot/iranyekanwebbold.eot?#iefix'format('embedded-opentype'),  /* IE6-8 */
      url('http://linux-zone.org/forums/fonts/iranyekan/woff2/iranyekanwebbold.woff2'format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
      url('http://linux-zone.org/forums/fonts/iranyekan/woff/iranyekanwebbold.woff'format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
      url('http://linux-zone.org/forums/fonts/iranyekan/ttf/iranyekanwebbold.ttf'format('truetype');
      }





      #acp-head-wrapper {
          
      font-familyiranyekan;
      }
      #acp-top-links {
          
      background#F5F4F4;
          
      margin0;
          
      padding0 35px;
          
      height28px;
          
      font-size12px;
          
      border-bottom1px solid #21282d;
          
      color#e9e9e9;
      }
      #acp-top-links li {
          
      list-stylenone;
          
      displayblock;
          
      height28px;
          
      line-height28px;
          
      padding0 20px;
      }
      #acp-top-links li.divider {
          
      border-left1px solid #DBDCDD;
          
      border-right1px solid #F7F7F7;
          
      padding0;
      }
      #acp-top-links li#acp-top-link-acp {
          
      border-top1px solid #21282d;
          
      border-left1px solid #21282d;
          
      border-right1px solid #21282d;
          
      background#303942;
          
      color#FFF;
          
      font-familyiranyekan;
          
      font-weightbold;
      }
      #acp-top-links li > a {
          
      displayblock;
          
      height28px;
          
      line-height28px;
      }
      #acp-top-links li#acp-top-link-site a {
          
      color#262d35;
          
      text-decorationnone;
      }
      #acp-logo-bar {
          
      backgroundurl("admincp_hd_back.png"repeat;
          
      height57px;
          
      clearboth;
      }
      #acp-logo-bar a {
          
      color#FFF;
          
      text-decorationnone;
      }
      #acp-logo-bar .logo {
          
      margin12px 12px 0;
      }
      #acp-logo-bar .logo img {
          
      height29px;
      }
      #acp-logo-bar .links {
          
      margin-top22px;
      }
      #acp-logo-bar .search {
          
      margin-top15px;
      }
      #acp-logo-bar .search input[type="text"] {
          
      width300px;
      }
      #acp-nav-wrapper {
          
      width:240px;
          
      padding10px 0;
          
      background-color:#686C73;
      }
      .
      acp-nav-controls {
          
      clearboth;
          
      margin0;
      }
      .
      acp-nav-controls a {
          
      border1px solid #41454C;
          
      color#DEE1E3;
          
      background-color#595D64;
          
      font-familyiranyekan;
          
      font-size11px;
          
      displayblock;
          
      height22px;
          
      margin4px 20px 0 20px;
          
      text-aligncenter;
          
      line-height22px;
          
      text-decorationnone;
          
      border-radius2px;
      }
      .
      acp-nav-controls a.nav-left {
          
      width96px;
      }
      .
      acp-nav-controls a.nav-right {
          
      width96px;
      }
      .
      acp-nav-controls div {
          
      clearboth;
      }
      .
      navtitle {
          
      backgroundurl("admincp_lnav_btn_default.png");
          
      height26px;
          
      border-top1px solid #7C8189;
          
      border-bottom1px solid #4F545B;
          
      font-familyiranyekan;
          
      font-weightbold;
          
      font-size12px;
          
      color#F2F2F2;
          
      -webkit-touch-calloutnone;
          -
      webkit-user-selectnone;
          -
      khtml-user-selectnone;
          -
      moz-user-selectnone;
          -
      ms-user-selectnone;
          
      user-selectnone;
      }
      .
      navtitle-open {
          
      backgroundurl("admincp_lnav_btn_active.png");
          
      color#000C1D;
      }
      .
      navgroup a {
          
      displayblock;
          
      height28px;
          
      line-height28px;
          
      background#E0E0E1;
          
      border-bottom1px solid #B1B1B1;
          
      text-decorationnone;
          
      font-familyiranyekan;
          
      font-size11px;
          
      color#000C1D;
      }




      /*========================================================================*\
      || ######################################################################
      || # Downloaded: 01:47, Sat May 18th 2019
      || # CVS: $RCSfile$ - $Revision: 100097 $
      || ######################################################################
      \*========================================================================*/ 


      when i check with inspect elements admin cp menus, it shows that page is using another font (font-family=Arial font) than what im chosing in the file.

      Click image for larger version  Name:	admincp.png Views:	30 Size:	240.4 KB ID:	4415904
      Last edited by habili; Tue 28 May '19, 7:21am.

      Comment

      • Wayne Luke
        vBulletin Technical Support Lead
        • Aug 2000
        • 73981

        #4
        This code is illegal code in a CSS file:

        Code:
        IRANYekan fonts are considered a proprietary software.
        To gain information about the laws regarding the use of these fonts, please visit www.fontiran.com
        
        This set of fonts are used in this project under the license: (HSY9B)
        Translations provided by Google.

        Wayne Luke
        The Rabid Badger - a vBulletin Cloud demonstration site.
        vBulletin 5 API

        Comment

        • habili
          Senior Member
          • Jan 2018
          • 253
          • 4.2.x

          #5
          i deleted those lines, but ther is no effect. i used another font (exept iranyekan) as font-family, but nothing happened.

          Comment

          • Mark.B
            vBulletin Support
            • Feb 2004
            • 24286
            • 6.0.X

            #6
            Make sure you clear the browser cache and restart the browser.
            MARK.B
            vBulletin Support
            ------------
            My Unofficial vBulletin 6.0.0 Demo: https://www.talknewsuk.com
            My Unofficial vBulletin Cloud Demo: https://www.adminammo.com

            Comment

            • habili
              Senior Member
              • Jan 2018
              • 253
              • 4.2.x

              #7
              i did all of your recomends, but still no effect.
              i changed forum font, its not a hard work, but i dont know why admincp font does not change.

              Comment

              • Wayne Luke
                vBulletin Technical Support Lead
                • Aug 2000
                • 73981

                #8
                I don't know what it isn't changing for you. Are you editing the default css or did you create a new cpstyle directory? If you created a new cpstyle directory, make sure there are no spaces in the name and that it doesn't contain any UTF-8 characters.

                I am able to change the font without problem with my custom CSS..

                Using Ubuntu Font -
                Click image for larger version  Name:	2019-05-24_8-23-30.png Views:	0 Size:	184.7 KB ID:	4415946




                Using a font called Indie Flower for a more radical change -
                Click image for larger version  Name:	2019-05-24_8-26-39.png Views:	0 Size:	218.4 KB ID:	4415947

                Last edited by Wayne Luke; Fri 24 May '19, 7:42am.
                Translations provided by Google.

                Wayne Luke
                The Rabid Badger - a vBulletin Cloud demonstration site.
                vBulletin 5 API

                Comment

                • Wayne Luke
                  vBulletin Technical Support Lead
                  • Aug 2000
                  • 73981

                  #9
                  Here is a version using two fonts (One for the headers and one for basic text) -
                  Click image for larger version

Name:	2019-05-24_8-35-53.png
Views:	186
Size:	171.0 KB
ID:	4415949

                  Translations provided by Google.

                  Wayne Luke
                  The Rabid Badger - a vBulletin Cloud demonstration site.
                  vBulletin 5 API

                  Comment

                  • habili
                    Senior Member
                    • Jan 2018
                    • 253
                    • 4.2.x

                    #10
                    Thanks for your follow up.
                    Yes, you are right. I install pagespeed module on my server and it was caching pages. Problem solved With clearing its cache and admincp font changed successfully.

                    I just have another question:
                    “Setting/options” part that i highlight it in below , its font did not change.

                    Click image for larger version

Name:	admincp-2.png
Views:	206
Size:	244.7 KB
ID:	4416118

                    Ofcourse when i find related class in “inspect element” and change font-family, it become ok but i cant find that class in css files and styles. Please help me find that

                    Comment

                    • Wayne Luke
                      vBulletin Technical Support Lead
                      • Aug 2000
                      • 73981

                      #11
                      Set it on the ID directly with your own custom CSS.

                      #settings-select {
                      your code here
                      }
                      Translations provided by Google.

                      Wayne Luke
                      The Rabid Badger - a vBulletin Cloud demonstration site.
                      vBulletin 5 API

                      Comment

                      widgetinstance 262 (Related Topics) skipped due to lack of content & hide_module_if_empty option.
                      Working...