Park himself wrote a blog theme collection

File Directory

--index.js
--readme.md
--theme
--acg
--acg.css
--acg.js
--readme.md
--light
--light.css
--light.js
--readme.md
--other themes ...

Generally how to run

• The index.js
  The index.js entrance file, it will merge the user and the default configuration and places it in the next window object, loading files relating to entry based on the selected topic theme.js

• theme.js
  user configuration object in the window object, the theme of building

• theme.css
  theme style file

Using themes

I ♥ point code address

1. Blog Garden Home -> Administration -> Switch Legacy backstage -> Settings
2. If you use a theme acgor lightset the blog is set to the default skinBuildtowin
3. Copy and paste the corresponding theme in css to page custom css
4. Check disable the default css styles
5. Copy and paste the following into the blog sidebar announcement (supports HTML code) (Support JS code)

    <script src="https://guangzan.gitee.io/awescnb-files/js/flexible.min.js"></script>
    <script src="https://github923665892.github.io/awesCnb-G/index.js"></script>
    <script>$.awesCnb({
                // 主题
                theme: {
                    name: 'acg',  // 'acg' (默认) | 'light' | 待添加
                    color: '#FFB3CC'  // #FFB3CC （默认）  | random
                },
                // 代码高亮
                highLight: {
                    type: 'atomOneDark' // 'atomOneDark' （默认） | 'atomOneLight' | 'github'
                },
                // 代码行号
                lineNumbers: {
                    enable: true  // true (默认) | false
                },
                // 文章目录
                catalog: {
                    enable: true  // true (默认) | false
                },
                // 音乐播放器
                musicPlayer: {
                    enable: true,  // true (默认) | false
                    type: 'APlayer'    // 'APlayer' （默认） | 'iframe'
                },
                // 底部友情链接
                links: [
                    {
                    name: 'theme awesCnb',
                    link: 'https://github.com/github923665892/awesCnb-G'
                    }
                ]
            });
    </script>

1. Copy and paste the following html to the top HTML

<section id='loading'>
     <div class="sk-fold">
         <div class="sk-fold-cube"></div>
         <div class="sk-fold-cube"></div>
         <div class="sk-fold-cube"></div>
         <div class="sk-fold-cube"></div>
      </div>
</section>

1. Storage

Theme acgCompleted function

• Mobile terminal adapted
• music
• Home revision
• Code optimization style
• Copy the code button
• Line number
• Article Directory
• Custom global theme color
• Links
• Top progress bar
• Comments optimization
  ...

Join

Welcome Welcome to ah ah ah welcome

• If you already own definition of a lot of your blog style garden, you only need to slightly modify the code to your blog, join in!
• From scratch!
• And optimize the existing theme with me!

How to do

1. You need to themecreate a new folder under the theme folder asdemo
2. New demo.js demo.cssnote js file names and folder names consistent
   
3. Start your job

problem

Have any questions you can comment at the end.