-
Notifications
You must be signed in to change notification settings - Fork 13
Expand file tree
/
Copy path1.html
More file actions
2056 lines (1666 loc) · 90.6 KB
/
1.html
File metadata and controls
2056 lines (1666 loc) · 90.6 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
<!DOCTYPE HTML>
<html lang="zh-CN">
<head><meta name="generator" content="Hexo 3.9.0">
<meta charset="utf-8">
<meta name="keywords" content="Github + Hexo 搭建个人博客超详细教程, Learning">
<meta name="baidu-site-verification" content="fmlEuI34ir">
<meta name="google-site-verification" content="yCy2azpds5XSuGZvis6OuA-XIGF5GuGpYRAaGfD6o48">
<meta name="360-site-verification" content="b7c11a830ef90fd1464ad6206bb7b6e7">
<meta name="description" content="
在搭建过程中遇到问题欢迎来骚扰我哈！ V：godxiaolong，QQ:1571504536，如果觉得有帮助的话不介意打赏一杯奶茶哟~
前言
作为一名计算机爱好者，摸索了一周搭建出自己的博客。目前只学 习了c语言，没有任何前端知识">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<meta name="renderer" content="webkit|ie-stand|ie-comp">
<meta name="mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<title>Github + Hexo 搭建个人博客超详细教程 | Shawlon`s Blog</title>
<link rel="icon" type="image/png" href="/favicon.png">
<link rel="stylesheet" type="text/css" href="/libs/awesome/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="/libs/materialize/materialize.min.css">
<link rel="stylesheet" type="text/css" href="/libs/aos/aos.css">
<link rel="stylesheet" type="text/css" href="/libs/animate/animate.min.css">
<link rel="stylesheet" type="text/css" href="/libs/lightGallery/css/lightgallery.min.css">
<link rel="stylesheet" type="text/css" href="/css/matery.css">
<link rel="stylesheet" type="text/css" href="/css/my.css">
<style type="text/css">
</style>
<script src="/libs/jquery/jquery-2.2.0.min.js"></script>
<script src="https://sdk.jinrishici.com/v2/browser/jinrishici.js" charset="utf-8"></script>
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?4d1d73af45a62734730491a6b6c41da4";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<script>(function (i, s, o, g, r, a, m) {
i['DaoVoiceObject'] = r;
i[r] = i[r] ||
function () {
(i[r].q = i[r].q || []).push(arguments);
};
i[r].l = 1 * new Date();
a = s.createElement(o);
m = s.getElementsByTagName(o)[0];
a.async = 1;
a.src = g;
a.charset = 'utf-8';
m.parentNode.insertBefore(a, m);
})(window, document, 'script', ('https:' === document.location.protocol ? 'https:' : 'http:') + "//widget.daovoice.io/widget/0fcc9bf7.js", 'daovoice');
daovoice('init', {
app_id: "0fcc9bf7",
});
daovoice('update');
</script>
<script>
(function(){
var bp = document.createElement('script');
var curProtocol = window.location.protocol.split(':')[0];
if (curProtocol === 'https') {
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
}
else {
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
}
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bp, s);
})();
</script>
<script>
(function(){
var src = "https://jspassport.ssl.qhimg.com/11.0.1.js?d182b3f28525f2db83acfaaf6e696dba";
document.write('<script src="' + src + '" id="sozz"><\/script>');
})();
</script>
<meta name="baidu-site-verification" content="code-FwB5xSTmVO">
<style type="text/css" lang="css">
#loading-container{
position: fixed;
top: 0;
left: 0;
min-height: 100vh;
width: 100vw;
z-index: 9999;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background: #FFF;
text-align: center;
/* loaderҳ����ʧ���ý����ķ�ʽ*/
-webkit-transition: opacity 1s ease;
-moz-transition: opacity 1s ease;
-o-transition: opacity 1s ease;
transition: opacity 1s ease;
}
.loading-image{
width: 120px;
height: 50px;
transform: translate(-50%);
}
.loading-image div:nth-child(2) {
-webkit-animation: pacman-balls 1s linear 0s infinite;
animation: pacman-balls 1s linear 0s infinite
}
.loading-image div:nth-child(3) {
-webkit-animation: pacman-balls 1s linear .33s infinite;
animation: pacman-balls 1s linear .33s infinite
}
.loading-image div:nth-child(4) {
-webkit-animation: pacman-balls 1s linear .66s infinite;
animation: pacman-balls 1s linear .66s infinite
}
.loading-image div:nth-child(5) {
-webkit-animation: pacman-balls 1s linear .99s infinite;
animation: pacman-balls 1s linear .99s infinite
}
.loading-image div:first-of-type {
width: 0;
height: 0;
border: 25px solid #49b1f5;
border-right-color: transparent;
border-radius: 25px;
-webkit-animation: rotate_pacman_half_up .5s 0s infinite;
animation: rotate_pacman_half_up .5s 0s infinite;
}
.loading-image div:nth-child(2) {
width: 0;
height: 0;
border: 25px solid #49b1f5;
border-right-color: transparent;
border-radius: 25px;
-webkit-animation: rotate_pacman_half_down .5s 0s infinite;
animation: rotate_pacman_half_down .5s 0s infinite;
margin-top: -50px;
}
@-webkit-keyframes rotate_pacman_half_up {0% {transform: rotate(270deg)}50% {transform: rotate(1turn)}to {transform: rotate(270deg)}}
@keyframes rotate_pacman_half_up {0% {transform: rotate(270deg)}50% {transform: rotate(1turn)}to {transform: rotate(270deg)}}
@-webkit-keyframes rotate_pacman_half_down {0% {transform: rotate(90deg)}50% {transform: rotate(0deg)}to {transform: rotate(90deg)}}
@keyframes rotate_pacman_half_down {0% {transform: rotate(90deg)}50% {transform: rotate(0deg)}to {transform: rotate(90deg)}}
@-webkit-keyframes pacman-balls {75% {opacity: .7}to {transform: translate(-100px, -6.25px)}}
@keyframes pacman-balls {75% {opacity: .7}to {transform: translate(-100px, -6.25px)}}
.loading-image div:nth-child(3),
.loading-image div:nth-child(4),
.loading-image div:nth-child(5),
.loading-image div:nth-child(6){
background-color: #49b1f5;
width: 15px;
height: 15px;
border-radius: 100%;
margin: 2px;
width: 10px;
height: 10px;
position: absolute;
transform: translateY(-6.25px);
top: 25px;
left: 100px;
}
.loading-text{
margin-bottom: 20vh;
text-align: center;
color: #2c3e50;
font-size: 2rem;
box-sizing: border-box;
padding: 0 10px;
text-shadow: 0 2px 10px rgba(0,0,0,0.2);
}
@media only screen and (max-width: 500px) {
.loading-text{
font-size: 1.5rem;
}
}
.fadeout {
opacity: 0;
filter: alpha(opacity=0);
}
/* logo���ֶ��� */
@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);}}
</style>
<script>
(function () {
const loaded = function(){
setTimeout(function(){
const loader = document.getElementById("loading-container");
loader.className="fadeout" ;//ʹ�ý����ķ�������loading page
// document.getElementById("body-wrap").style.display="flex";
setTimeout(function(){
loader.style.display="none";
},1000);
},1000);//ǿ����ʾloading page 1s
};
loaded();
})()
</script><link rel="stylesheet" href="/css/prism-tomorrow.css" type="text/css">
<link rel="stylesheet" href="/css/prism-line-numbers.css" type="text/css"><style type="text/css" lang="css">
#loading-container{
position: fixed;
top: 0;
left: 0;
min-height: 100vh;
width: 100vw;
z-index: 9999;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background: #FFF;
text-align: center;
/* loaderҳ����ʧ���ý����ķ�ʽ*/
-webkit-transition: opacity 1s ease;
-moz-transition: opacity 1s ease;
-o-transition: opacity 1s ease;
transition: opacity 1s ease;
}
.loading-image{
width: 120px;
height: 50px;
transform: translate(-50%);
}
.loading-image div:nth-child(2) {
-webkit-animation: pacman-balls 1s linear 0s infinite;
animation: pacman-balls 1s linear 0s infinite
}
.loading-image div:nth-child(3) {
-webkit-animation: pacman-balls 1s linear .33s infinite;
animation: pacman-balls 1s linear .33s infinite
}
.loading-image div:nth-child(4) {
-webkit-animation: pacman-balls 1s linear .66s infinite;
animation: pacman-balls 1s linear .66s infinite
}
.loading-image div:nth-child(5) {
-webkit-animation: pacman-balls 1s linear .99s infinite;
animation: pacman-balls 1s linear .99s infinite
}
.loading-image div:first-of-type {
width: 0;
height: 0;
border: 25px solid #49b1f5;
border-right-color: transparent;
border-radius: 25px;
-webkit-animation: rotate_pacman_half_up .5s 0s infinite;
animation: rotate_pacman_half_up .5s 0s infinite;
}
.loading-image div:nth-child(2) {
width: 0;
height: 0;
border: 25px solid #49b1f5;
border-right-color: transparent;
border-radius: 25px;
-webkit-animation: rotate_pacman_half_down .5s 0s infinite;
animation: rotate_pacman_half_down .5s 0s infinite;
margin-top: -50px;
}
@-webkit-keyframes rotate_pacman_half_up {0% {transform: rotate(270deg)}50% {transform: rotate(1turn)}to {transform: rotate(270deg)}}
@keyframes rotate_pacman_half_up {0% {transform: rotate(270deg)}50% {transform: rotate(1turn)}to {transform: rotate(270deg)}}
@-webkit-keyframes rotate_pacman_half_down {0% {transform: rotate(90deg)}50% {transform: rotate(0deg)}to {transform: rotate(90deg)}}
@keyframes rotate_pacman_half_down {0% {transform: rotate(90deg)}50% {transform: rotate(0deg)}to {transform: rotate(90deg)}}
@-webkit-keyframes pacman-balls {75% {opacity: .7}to {transform: translate(-100px, -6.25px)}}
@keyframes pacman-balls {75% {opacity: .7}to {transform: translate(-100px, -6.25px)}}
.loading-image div:nth-child(3),
.loading-image div:nth-child(4),
.loading-image div:nth-child(5),
.loading-image div:nth-child(6){
background-color: #49b1f5;
width: 15px;
height: 15px;
border-radius: 100%;
margin: 2px;
width: 10px;
height: 10px;
position: absolute;
transform: translateY(-6.25px);
top: 25px;
left: 100px;
}
.loading-text{
margin-bottom: 20vh;
text-align: center;
color: #2c3e50;
font-size: 2rem;
box-sizing: border-box;
padding: 0 10px;
text-shadow: 0 2px 10px rgba(0,0,0,0.2);
}
@media only screen and (max-width: 500px) {
.loading-text{
font-size: 1.5rem;
}
}
.fadeout {
opacity: 0;
filter: alpha(opacity=0);
}
/* logo���ֶ��� */
@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);}}
</style>
<script>
(function () {
const loaded = function(){
setTimeout(function(){
const loader = document.getElementById("loading-container");
loader.className="fadeout" ;//ʹ�ý����ķ�������loading page
// document.getElementById("body-wrap").style.display="flex";
setTimeout(function(){
loader.style.display="none";
},1000);
},1000);//ǿ����ʾloading page 1s
};
loaded();
})()
</script></head>
<div id="loading-container">
<p class="loading-text"></p>
<div class="loading-image">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div><body>
<header class="navbar-fixed">
<nav id="headNav" class="bg-color nav-transparent">
<div id="navContainer" class="nav-wrapper container">
<div class="brand-logo">
<a href="/" class="waves-effect waves-light">
<img src="/medias/logo.png" class="logo-img" alt="LOGO">
<span class="logo-span">Shawlon`s Blog</span>
</a>
</div>
<a href="#" data-target="mobile-nav" class="sidenav-trigger button-collapse"><i class="fa fa-navicon"></i></a>
<ul class="right">
<li class="hide-on-med-and-down">
<a href="/" class="waves-effect waves-light">
<span>首页</span>
</a>
</li>
<li class="hide-on-med-and-down">
<a href="/tags" class="waves-effect waves-light">
<span>标签</span>
</a>
</li>
<li class="hide-on-med-and-down">
<a href="/categories" class="waves-effect waves-light">
<span>分类</span>
</a>
</li>
<li class="hide-on-med-and-down">
<a href="/archives" class="waves-effect waves-light">
<span>归档</span>
</a>
</li>
<li class="hide-on-med-and-down">
<a href="/about" class="waves-effect waves-light">
<span>关于</span>
</a>
</li>
<li class="hide-on-med-and-down">
<a href="/friends" class="waves-effect waves-light">
<span>友情链接</span>
</a>
</li>
<li class="hide-on-med-and-down">
<a href="/contact" class="waves-effect waves-light">
<span>留言板</span>
</a>
</li>
<li>
<a href="#searchModal" class="modal-trigger waves-effect waves-light">
<i id="searchIcon" class="fa fa-search" title="搜索"></i>
</a>
</li>
</ul>
<div id="mobile-nav" class="side-nav sidenav">
<div class="mobile-head bg-color">
<img src="/medias/logo.png" class="logo-img circle responsive-img">
<div class="logo-name">Shawlon`s Blog</div>
<div class="logo-desc">
C/C++ | Linux | Ros
</div>
</div>
<ul class="menu-list mobile-menu-list">
<li>
<a href="/" class="waves-effect waves-light">
<i class="fa fa-fw fa-link"></i>
首页
</a>
</li>
<li>
<a href="/tags" class="waves-effect waves-light">
<i class="fa fa-fw fa-link"></i>
标签
</a>
</li>
<li>
<a href="/categories" class="waves-effect waves-light">
<i class="fa fa-fw fa-link"></i>
分类
</a>
</li>
<li>
<a href="/archives" class="waves-effect waves-light">
<i class="fa fa-fw fa-link"></i>
归档
</a>
</li>
<li>
<a href="/about" class="waves-effect waves-light">
<i class="fa fa-fw fa-link"></i>
关于
</a>
</li>
<li>
<a href="/friends" class="waves-effect waves-light">
<i class="fa fa-fw fa-link"></i>
友情链接
</a>
</li>
<li>
<a href="/contact" class="waves-effect waves-light">
<i class="fa fa-fw fa-link"></i>
留言板
</a>
</li>
<li><div class="divider"></div></li>
<li>
<a href="https://github.com/muyiio" class="waves-effect waves-light" target="_blank">
<i class="fa fa-github-square fa-fw"></i>Fork Me
</a>
</li>
</ul>
</div>
</div>
<style>
.nav-transparent .github-corner {
display: none !important;
}
.github-corner {
position: absolute;
z-index: 10;
top: 0;
right: 0;
border: 0;
transform: scale(1.1);
}
.github-corner svg {
color: #0f9d58;
fill: #fff;
height: 64px;
width: 64px;
}
.github-corner:hover .octo-arm {
animation: a 0.56s ease-in-out;
}
.github-corner .octo-arm {
animation: none;
}
@keyframes a {
0%,
to {
transform: rotate(0);
}
20%,
60% {
transform: rotate(-25deg);
}
40%,
80% {
transform: rotate(10deg);
}
}
</style>
<a href="https://github.com/muyiio" class="github-corner tooltipped hide-on-med-and-down" target="_blank"
data-tooltip="Fork Me" data-position="left" data-delay="50">
<svg viewBox="0 0 250 250" aria-hidden="true">
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
<path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"
fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path>
<path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z"
fill="currentColor" class="octo-body"></path>
</svg>
</a>
</nav>
</header>
<script src="/libs/cryptojs/crypto-js.min.js"></script>
<script>
(function() {
let pwd = '';
if (pwd && pwd.length > 0) {
if (pwd !== CryptoJS.SHA256(prompt('请输入访问本文章的密码')).toString(CryptoJS.enc.Hex)) {
alert('密码错误，将返回主页！');
location.href = '/';
}
}
})();
</script>
<div class="bg-cover pd-header post-cover" style="background-image: url('/medias/featureimages/34.jpg')">
<div class="container">
<div class="row">
<div class="col s12 m12 l12">
<div class="brand">
<div class="description center-align post-title">
Github + Hexo 搭建个人博客超详细教程
</div>
</div>
</div>
</div>
</div>
</div>
<main class="post-container content">
<link rel="stylesheet" href="/libs/tocbot/tocbot.css">
<style>
#articleContent h1::before,
#articleContent h2::before,
#articleContent h3::before,
#articleContent h4::before,
#articleContent h5::before,
#articleContent h6::before {
display: block;
content: " ";
height: 100px;
margin-top: -100px;
visibility: hidden;
}
#articleContent :focus {
outline: none;
}
.toc-fixed {
position: fixed;
top: 64px;
}
.toc-widget {
padding-left: 20px;
}
.toc-widget .toc-title {
margin: 35px 0 15px 0;
padding-left: 17px;
font-size: 1.5rem;
font-weight: bold;
line-height: 1.5rem;
}
.toc-widget ol {
padding: 0;
list-style: none;
}
#toc-content ol {
padding-left: 10px;
}
#toc-content ol li {
padding-left: 10px;
}
#toc-content .toc-link:hover {
color: #42b983;
font-weight: 700;
text-decoration: underline;
}
#toc-content .toc-link::before {
background-color: transparent;
max-height: 25px;
}
#toc-content .is-active-link {
color: #42b983;
}
#toc-content .is-active-link::before {
background-color: #42b983;
}
#floating-toc-btn {
position: fixed;
right: 20px;
bottom: 76px;
padding-top: 15px;
margin-bottom: 0;
z-index: 998;
}
#floating-toc-btn .btn-floating {
width: 48px;
height: 48px;
}
#floating-toc-btn .btn-floating i {
line-height: 48px;
font-size: 1.4rem;
}
</style>
<div class="row">
<div id="main-content" class="col s12 m12 l9">
<!-- 文章内容详情 -->
<div id="artDetail">
<div class="card">
<div class="card-content article-info">
<div class="row tag-cate">
<div class="col s7">
<div class="article-tag">
<a href="/tags/Github/" target="_blank">
<span class="chip bg-color">Github</span>
</a>
<a href="/tags/Hexo/" target="_blank">
<span class="chip bg-color">Hexo</span>
</a>
<a href="/tags/博客搭建/" target="_blank">
<span class="chip bg-color">博客搭建</span>
</a>
</div>
</div>
<div class="col s5 right-align">
<div class="post-cate">
<i class="fa fa-bookmark fa-fw icon-category"></i>
<a href="/categories/Blog/" class="post-category" target="_blank">
Blog
</a>
</div>
</div>
</div>
<div class="post-info">
<div class="post-date info-break-policy">
<i class="fa fa-calendar-minus-o fa-fw"></i>发布日期:
2020-02-18
</div>
<div class="post-author info-break-policy">
<i class="fa fa-user-o fa-fw"></i>作者:
Tyzhao
</div>
<div class="info-break-policy">
<i class="fa fa-file-word-o fa-fw"></i>文章字数:
4.5k
</div>
<div class="info-break-policy">
<i class="fa fa-clock-o fa-fw"></i>阅读时长:
16 分
</div>
<div id="busuanzi_container_page_pv" class="info-break-policy">
<i class="fa fa-eye fa-fw"></i>阅读次数:
<span id="busuanzi_value_page_pv"></span>
</div>
</div>
</div>
<hr class="clearfix">
<div class="card-content article-card-content">
<div id="articleContent">
<p><img src="01.png" alt></p>
<p><font color="magenta" size="4"><strong>在搭建过程中遇到问题欢迎来骚扰我哈！<font color="red" size="4"> V：godxiaolong，QQ:1571504536</font>，如果觉得有帮助的话不介意打赏一杯奶茶哟~</strong></font></p>
<p><img src="02.png" alt></p>
<h1 id="前言"><a href="#前言" class="headerlink" title="前言"></a>前言</h1><ul>
<li><p>作为一名计算机爱好者，摸索了一周搭建出自己的博客。目前只学 习了c语言，没有任何前端知识和网站开发经验，总的来说，算不上很难， 但也要费些心思。网上各类教程应有尽有，只要肯摸索，还是水到渠成的事。另外，写下这篇文章，记录下自己的经验，给需要的朋友，祝你早日拥有自己的博客！</p>
</li>
<li><p>搭建博客的初衷是希望用博客记录下自己的学习过程，帮助自己复习，分享一部分不成熟的思考，敦促自己把既定的目标完成。</p>
</li>
<li><p><strong>为什么要搭建自己的博客？可以看看这三篇文章：</strong></p>
</li>
</ul>
<p><a href="http://mindhacks.cn/2009/02/15/why-you-should-start-blogging-now/" title="为什么你应该（从现在开始就）写博客" target="_blank" rel="noopener">《为什么你应该（从现在开始就）写博客》</a> (By 刘未鹏 | Mind Hacks)</p>
<p><a href="https://www.zhihu.com/question/19916345" title="为什么要自建博客？" target="_blank" rel="noopener">《为什么要自建博客？》</a> (By 知乎)</p>
<p><a href="https://www.cnblogs.com/jhzhu/p/3893297.html" title="我为什么写博客" target="_blank" rel="noopener">《我为什么写博客》</a> （By 知明所以）</p>
<p>我们需要知道搭建博客要用到的框架。<font color="red" size="3">Hexo</font>是高效的静态站点生成框架，它基于<font color="red" size="3">Node.js</font>。我们使用<font color="red" size="3">MarkDown</font>在本地编辑我们的博客文章，通过<font color="red" size="3">Hexo</font>生成静态页面，再用两条命令即可部署到我们的网站。无需关心网页源代码的具体细节，我们只需要用心写好自己的博客内容就行。</p>
<h2 id="本文目录"><a href="#本文目录" class="headerlink" title="本文目录"></a>本文目录</h2><ul>
<li><strong>快速搭建</strong></li>
<li>安装<font color="red" size="3">Node.js</font></li>
<li>添加国内镜像</li>
<li>安装<font color="red" size="3">Git </font></li>
<li>注册<font color="red" size="3">Github</font>账号</li>
<li>创建<font color="red" size="3">Git</font>仓库</li>
<li>安装<font color="red" size="3">Hexo</font> </li>
<li>配置本地<font color="red" size="3">Hexo</font></li>
<li>连接<font color="red" size="3">Github</font>与本地 </li>
<li>写文章、发布文章 </li>
<li><font color="red" size="3">MarkDown</font>文章编辑器说明</li>
<li>配置个性化域名</li>
<li>更换自己喜欢的<font color="red" size="3">Hexo</font>主题</li>
<li>我的博客源代码</li>
<li>结语</li>
</ul>
<hr>
<h1 id="快速搭建（直接使用我的博客源代码）"><a href="#快速搭建（直接使用我的博客源代码）" class="headerlink" title="快速搭建（直接使用我的博客源代码）"></a>快速搭建（直接使用我的博客源代码）</h1><p><strong>建议自己成功搭建博客之后再使用我的源代码，新手容易出错</strong></p>
<p>有的朋友可能不想去折腾，自定义主题也比较麻烦，亦或有尝试几次搭建却失败，那就可以看这部分。快速搭建可以帮助我们更快搭建出自己的博客，优点是别人博客有的东西你都有，就跟复制差不多；缺点是博客里的配置信息都是别人的，不过不要紧，稍稍改改配置就可以。</p>
<p>在这里以我的博客为例。</p>
<h2 id="一、下载博客源代码"><a href="#一、下载博客源代码" class="headerlink" title="一、下载博客源代码"></a>一、下载博客源代码</h2><p>大家可以直接素质二连，<font color="red" size="3">Star&Fork</font>我的博客源代码：<a href="https://github.com/MUYIio/hexo-themes-matery" target="_blank" rel="noopener">https://github.com/MUYIio/hexo-themes-matery</a>，这里我给出两种下载方法：</p>
<p><img src="03.png" alt></p>
<p><strong>第一种</strong>：直接<font color="red" size="3">DownLoad</font>，下载到本地就可以。（<strong>不推荐</strong>）</p>
<p><strong>第二种</strong>：如果你已经安装了<a href="https://git-scm.com/download/win" title="Git" target="_blank" rel="noopener">Git</a>，就可以右键单击<font color="red" size="3">Come Bash Here</font>运行</p>
<pre class="line-numbers language-bash"><code class="language-bash"><span class="token function">git</span> clone git@github.com:MUYIio/hexo-themes-matery.git<span aria-hidden="true" class="line-numbers-rows"><span></span></span></code></pre>
<p>将所有文件下载到本地，这个复杂一点。</p>
<h2 id="二、修改博客文档配置"><a href="#二、修改博客文档配置" class="headerlink" title="二、修改博客文档配置"></a>二、修改博客文档配置</h2><p>首先将我们下载的博客源代码解压，然后修改主要配置：</p>
<ul>
<li><strong>点击查看隐藏的文件夹删除 .git 文件夹，将自己博客仓库的 .git 文件夹拷贝进去</strong></li>
<li>根目录配置文件<font color="red" size="3">_config.yml</font>和主题目录配置文件<font color="red" size="3">_config.yml</font>中修改个人信息。</li>
<li>根目录配置文件中修改<font color="red" size="3">deploy</font>一栏的<font color="red" size="3">repository</font>，修改为自己的仓库地址。</li>
<li>根目录配置文件中修改<font color="red" size="3">baidu_url_submit</font>一栏的<font color="red" size="3">token</font>。</li>
<li>主题配置文件中修改<font color="red" size="3">gitalk</font>一栏，修改方法见正文。</li>
</ul>
<p>我给出的是博客比较明显的几个地方，先修改这几个地方，其它的可以自己慢慢摸索修改。</p>
<p>最后一步，<strong>本地的运行环境还是需要搭建好的</strong>，跟着下文操作到连接Github与本地，环境就算是搭建完成。</p>
<p><strong>本地环境搭建好之后会生成的文件：</strong></p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/35.png" alt></p>
<p>然后直接把<font color="red" size="3">Hexo</font>文件夹里面的文件删掉，把我的源代码的文件全部移动过来，就是这样了：</p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/37.png" alt></p>
<p>然后在<font color="red" size="3">Hexo</font>文件夹下右键单击鼠标，点击 <font color="red" size="3">Git Bash Here</font>点击输入以下命令上传就可以了：</p>
<pre><code>hexo clean
hexo g
hexo d</code></pre><h1 id="安装Node-js"><a href="#安装Node-js" class="headerlink" title="安装Node.js"></a>安装Node.js</h1><p>了解一下什么是<font color="red" size="3">Node.js</font>：</p>
<blockquote>
<p><font color="red" size="3">Node.js</font>就是一个用于创建服务器端应用程序的运行系统，它可以轻松构建网络或其他事件驱动的应用程序服务器。</p>
</blockquote>
<p>需要用到的命令：</p>
<pre><code>$ git --version
$ node -v
$ npm -v</code></pre><p><a href="https://nodejs.org/en/download/" title="Node.js" target="_blank" rel="noopener">点击此处</a>进入<font color="red" size="3">Node.js</font>官网下载相应版本即可，安装时选项全部默认，一路点击<font color="red" size="3">Next</font>。</p>
<p><img src="04.png" alt></p>
<p>检验是否安装成功：<br>按<font color="red" size="3">Win+R</font>打开命令提示符，输入<font color="red" size="3">node -v</font>和<font color="red" size="3">npm -v</font>，如果出现版本号，那么就安装成功了。</p>
<p><img src="https://muyiio-1300292673.cos.ap-chongqing.myqcloud.com/%E5%8D%9A%E5%AE%A2/_posts/1/05.png" alt></p>
<h1 id="添加国内镜像"><a href="#添加国内镜像" class="headerlink" title="添加国内镜像"></a>添加国内镜像</h1><p>这里我们使用阿里的国内镜像进行加速，按Win+R打开命令提示符输入：</p>
<pre><code>npm config set registry https://registry.npm.taobao.org</code></pre><h1 id="安装Git"><a href="#安装Git" class="headerlink" title="安装Git"></a>安装Git</h1><blockquote>
<p><font color="red" size="3">Git</font>是一个开源的分布式版本控制系统，可以有效、高速地处理从很小到非常大的项目版本管理，帮助我们把本地网页上传到<font color="red" size="3">Github</font>。</p>
</blockquote>
<p><a href="https://git-scm.com/download/win" title="Git" target="_blank" rel="noopener">点击此处</a>进入Git官网下载相应版本，默认安装即可。</p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/005.png" alt></p>
<p>参考资料：<a href="https://www.cnblogs.com/jytx/p/5602927.html" title="如何在windows下安装GIT" target="_blank" rel="noopener">《如何在windows下安装GIT》</a> (By 俊雨廷休)</p>
<p>检验是否安装成功：</p>
<p>安装完成后在命令提示符中输入<font color="red" size="3">git –version</font>验证是否安装成功</p>
<pre><code>git --version</code></pre><p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/06.png" alt></p>
<h1 id="注册Github账号"><a href="#注册Github账号" class="headerlink" title="注册Github账号"></a>注册Github账号</h1><p><font color="red" size="3">Github</font>作为全球最大的开源社区，相信朋友们都已经有了吧，如果没有，<a href="https://github.com/" title="Github" target="_blank" rel="noopener">点击此处</a>进入<font color="red" size="3">Github</font>官网点击 <font color="red" size="3">Sign Up </font>注册账户。</p>
<h1 id="创建git仓库"><a href="#创建git仓库" class="headerlink" title="创建git仓库"></a>创建git仓库</h1><p>登录<font color="red" size="3">Github</font>创建一个仓库</p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/07.png" alt></p>
<p>如下图所示，<strong>输入自己的项目名字，后面一定要加<font color="red" size="3">.github.io</font>后缀，<font color="red" size="3">README</font>初始化也要勾上。名称一定要和你的<font color="red" size="3">Github</font>名字完全一样，比如你<font color="red" size="3">github</font>名字叫<font color="red" size="3">A</font>，那么仓库名字一定要是<font color="red" size="3">A.github.io</font>。</strong></p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/08.png" alt></p>
<p>选择一个自己喜欢的主题：<br>在上面创建的仓库里面点击<font color="red" size="3">Settings</font>（不是头像下面那个<font color="red" size="3">Settings</font>），向下拉到最后有个<font color="red" size="3">GitHub Pages</font>，点击<font color="red" size="3">Choose a theme</font>选择一个主题。然后等一会儿，再回到<font color="red" size="3">GitHub Pages</font>，就可以预览效果啦。</p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/09.png" alt></p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/10.png" alt></p>
<h1 id="安装Hexo"><a href="#安装Hexo" class="headerlink" title="安装Hexo"></a>安装Hexo</h1><blockquote>
<p><font color="red" size="3">Hexo</font>是一款基于<font color="red" size="3">Node.js</font>的静态博客框架，依赖少易于安装使用，可以方便的生成静态网页托管在<font color="red" size="3">GitHub</font>和<font color="red" size="3">Heroku</font>上，是搭建博客的首选框架。</p>
</blockquote>
<p>选择一个磁盘，新建一个文件夹用来存放博客文件。比如我的<font color="red" size="3">（C/panakot Blog）</font>，在该文件夹下右键单击鼠标，点击<font color="red" size="3"> Git Bash Here</font>，输入以下<font color="red" size="3"> npm </font>命令即可安装</p>
<pre><code>$ npm install hexo-cli -g</code></pre><p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/11.png" alt></p>
<p>输入<font color="red" size="3">hexo -v</font>即可检验是否安装成功，我这里就不演示了。</p>
<h1 id="配置本地hexo"><a href="#配置本地hexo" class="headerlink" title="配置本地hexo"></a>配置本地hexo</h1><p>还是在刚才新建的文件夹下再新建一个<font color="red" size="3">Hexo</font>文件夹，比如我的<font color="red" size="3">（C/panakot Blog/Hexo）</font>，在<font color="red" size="3">Hexo</font>文件夹下右键单击鼠标，点击<font color="red" size="3"> Git Bash Here</font>，依次输入以下<font color="red" size="3"> npm </font>命令即可初始化。</p>
<pre><code>hexo init
npm install</code></pre><p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/12.png" alt></p>
<p>初始化成功生成的文件：</p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/13.png" alt></p>
<p>接着我们输入<font color="red" size="3">hexo g</font>生成静态网页，然后输入<font color="red" size="3">hexo s</font>打开本地服务器，然后浏览器打开<a href="http://localhost:4000/" target="_blank" rel="noopener">http://localhost:4000/</a>，就可以预览我们的博客啦，如图：</p>
<p>显示以下信息说明操作正确：</p>
<p><code>INFO Hexo is running at http://0.0.0.0:4000/. Press Ctrl+C to stop.</code></p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/14.png" alt></p>
<p>按<font color="red" size="3">ctrl+c</font>关闭本地服务器。</p>
<p><strong>我们以后常用到的<font color="red" size="3">Hexo</font>命令：</strong></p>
<ul>
<li><p><font color="red" size="3">hexo s</font>等价于 <font color="red" size="3">hexo server</font> #<font color="red" size="3">Hexo</font> 会监视文件变动并自动更新，除修改站点配置文件外,无须重启服务器,直接刷新网页即可生效。</p>
</li>
<li><p><font color="red" size="3">hexo g</font> 等价于 <font color="red" size="3">hexo generate</font> #生成静态网页 (执行 $ <font color="red" size="3">hexo g</font>后会在站点根目录下生成<font color="red" size="3">public</font>文件夹,<font color="red" size="3"> hexo</font>会将”<font color="red" size="3">/blog/source/</font>“ 下面的<font color="red" size="3">.md</font>后缀的文件编译为<font color="red" size="3">.html</font>后缀的文件,存放在”<font color="red" size="3">/blog/public/ </font>“ 路径下)</p>
</li>
<li><p><font color="red" size="3">hexo d </font>等价于 <font color="red" size="3">hexo deploy</font> #将本地数据部署到远端服务器(如<font color="red" size="3">github</font>)</p>
</li>
<li><p><font color="red" size="3">hexo clean </font> #清除缓存 ,网页正常情况下可以忽略此条命令,执行该指令后,会删掉站点根目录下的<font color="red" size="3">public</font>文件夹</p>
</li>
</ul>
<h1 id="连接Github与本地"><a href="#连接Github与本地" class="headerlink" title="连接Github与本地"></a>连接Github与本地</h1><h2 id="一、生成密钥"><a href="#一、生成密钥" class="headerlink" title="一、生成密钥"></a>一、生成密钥</h2><p>右键单击鼠标，点击 <font color="red" size="3">Git Bash Here</font>输入以下命令：</p>
<pre><code>git config --global user.name "Name"
git config --global user.email "Email"</code></pre><p><strong><font color="red" size="3">Name</font>和<font color="red" size="3">Email</font>是我们注册<font color="red" size="3">Github</font>时的用户名和邮箱。</strong></p>
<p>然后生成密钥：</p>
<pre><code>ssh-keygen -t rsa -C "Email"</code></pre><p><strong><font color="red" size="3">Email</font>是我们注册<font color="red" size="3">Github</font>时的邮箱</strong></p>
<p>然后会出现：</p>
<pre><code>Generating public/private rsa key pair.
Enter file in which to save the key (/c/Users/you/.ssh/id_rsa):
//到这里可以直接回车将密钥按默认文件进行存储</code></pre><p>回车之后：</p>
<pre><code>Enter passphrase (empty for no passphrase):
//这里是要你输入密码，其实不需要输什么密码，直接回车就行
Enter same passphrase again:</code></pre><p>接下来会有：</p>
<pre><code>Your identification has been saved in /c/Users/you/.ssh/id_rsa.
Your public key has been saved in /c/Users/you/.ssh/id_rsa.pub.
The key fingerprint is:
这里是各种字母数字组成的字符串，结尾是你的邮箱
The key's randomart image is:
这里也是各种字母数字符号组成的字符串</code></pre><p>现在密钥已经生成，一般存放在<font color="red" size="3">（/c/Users/you/.ssh/id_rsa.pub.）</font>，我们运行下面的命令将密钥复制为粘贴板：</p>
<pre><code> clip < ~/.ssh/id_rsa.pub</code></pre><p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/15.png" alt></p>
<h2 id="二、连接Github"><a href="#二、连接Github" class="headerlink" title="二、连接Github"></a>二、连接Github</h2><p>在<font color="red" size="3">Github</font>头像下面点击<font color="red" size="3">Settings</font>，再点击<font color="red" size="3">SSH and GPG keys</font>，新建一个<font color="red" size="3">SSH</font>，名字任意。</p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/16.png" alt></p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/17.png" alt></p>
<p>然后将刚才复制的密钥添加就可以了，像这样：</p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/18.png" alt></p>
<p><strong>本地连接Github</strong></p>
<p>右键单击鼠标，点击<font color="red" size="3"> Git Bash Here</font>输入以下命令，如果如下图所示，出现你的用户名，那就成功了</p>
<pre><code>ssh -T git@github.com
//注意不要做任何修改</code></pre><p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/19.png" alt></p>
<p>用编辑器打开博客根目录下的<font color="red" size="3">_config.yml</font>文件，我用的是记事本，当然vscode也可以这是博客的配置文件，我们需要修改一下才能连接<font color="red" size="3">Github</font>。</p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/20.png" alt></p>
<p>修改最后一行的配置：</p>
<pre><code># Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type:</code></pre><p>改为：</p>
<pre><code># Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repository: git@github.com:panakot/panakot.github.io.git //自己的仓库地址
branch: master</code></pre><p>这个是我的更为完整：</p>
<pre><code># Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
- type: git
repository:
github: git@github.com:MUYIio/MUYIio.github.io.git //GitHub仓库
coding: git@e.coding.net:godxiaolon/yshawlon/feezxe.git //coding仓库
gitee: git@gitee.com:feezxe/feezxe.git //gitee仓库
#repo: root@xxxxx :/home/git/blog.git //前面加#表示注释掉，这个是服务器地址
branch: master
- type: baidu_url_submitter</code></pre><p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.8/Images/posts/1/21.png" alt></p>
<p>切记：</p>
<ul>
<li><strong><font color="red" size="3">repository</font>修改为你自己的<font color="red" size="3">github</font>项目地址</strong>。</li>
<li><strong>每一个冒号后面都有一个空格。</strong></li>
</ul>
<h1 id="写文章、发布文章"><a href="#写文章、发布文章" class="headerlink" title="写文章、发布文章"></a>写文章、发布文章</h1><p>首先在博客根目录下右键打开<font color="red" size="3">Git Bash Here</font>输入以下命令，安装一个扩展.</p>
<pre><code>npm i hexo-deployer-git</code></pre><p>然后输入下面的命令，新建一篇文章。</p>
<pre><code>hexo new post "article title"</code></pre><p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/22.png" alt></p>
<p>然后打开<font color="red" size="3">C:\panakot Blog\Hexo\source_posts</font>的目录，可以发现下面多了一个文件夹和一个<font color="red" size="3">.md</font>文件，一个用来存放你的图片等数据，另一个就是你的文章文件啦。</p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/23.png" alt></p>
<p>编写完<font color="red" size="3">markdown</font>文件后，根目录下右键打开<font color="red" size="3">Git Bash Here</font>输入<font color="red" size="3">hexo g</font>生成静态网页，然后输入<font color="red" size="3">hexo s</font>可以本地预览效果，最后输入<font color="red" size="3">hexo d</font>上传到<font color="red" size="3">github</font>上。</p>
<p>你的博客地址：<font color="red" size="3">https://你的用户名.github.io</font>，比如我的是：<a href="https://muyiio.github.io" target="_blank" rel="noopener">https://muyiio.github.io</a>，现在每个人都可以通过此链接访问你的博客</p>
<h1 id="MarkDown文章编辑器说明"><a href="#MarkDown文章编辑器说明" class="headerlink" title="MarkDown文章编辑器说明"></a>MarkDown文章编辑器说明</h1><blockquote>
<p>前面我们提到了使用<font color="red" size="3">MarkDown</font>编辑我们的博客文章。<font color="red" size="3"> Markdown</font> 是<font color="red" size="3"> 2004</font> 年由 <font color="red" size="3">John Gruberis </font>设计和开发的纯文本格式的语法，非常的简单实用，常用的标记符号屈指可数，几分钟即可学会，<font color="red" size="3"> .md </font>文件可以使用支持 <font color="red" size="3">Markdown </font>语法的编辑器编辑，然后将写好的文章<font color="red" size="3">（.md文件）</font>保存到<font color="red" size="3"> \Hexo\source_posts </font>文件夹下即可。</p>
</blockquote>
<p> <font color="red" size="3">Windows </font>上推荐使用 <font color="red" size="3">MarkdownPad2 </font>或者<font color="red" size="3">小书匠</font>编辑器，<font color="red" size="3">macOS </font>上使用<font color="red" size="3"> Mou</font> 编辑器，<font color="red" size="3">Linux </font>上使用 <font color="red" size="3">Remarkable</font> 编辑器，<font color="red" size="3">Web </font>端上使用 简书。</p>
<p><strong><a href="http://markdownpad.com/download.html" title="MarkDown" target="_blank" rel="noopener">点击此处</a>下载<font color="red" size="3">MarkDown</font><br>，刚使用的朋友或许不知道如何使用这个编辑器，只需要几分钟就可以掌握啦，给出以下几个我觉得不错的参考：</strong></p>
<p><a href="https://www.jianshu.com/p/q81RER/" title="献给写作者的 Markdown 新手指南" target="_blank" rel="noopener">《献给写作者的 Markdown 新手指南》</a> （By 简书）</p>
<p><a href="https://blog.csdn.net/u014061630/article/details/81359144?utm_source=app" title="Markdown语法图文全面详解" target="_blank" rel="noopener">《Markdown语法图文全面详解(10分钟学会)》</a>（By 黑暗星球）</p>
<p><a href="https://blog.csdn.net/witnessai1/article/details/52551362?utm_source=app" title="Markdown 语法手册 （完整整理版）" target="_blank" rel="noopener">《Markdown 语法手册 （完整整理版）》</a> （By witnessai1）</p>
<p><a href="https://sspai.com/post/25137" title="认识与入门 Markdown" target="_blank" rel="noopener">《认识与入门 Markdown》</a>（By Te_Lee）</p>
<p>写完文章记得在博客根目录<font color="red" size="3">Bash Here</font>输入<font color="red" size="3">hexo g</font>和<font color="red" size="3">hexo d</font>上传到网站。</p>
<h1 id="配置个性化域名"><a href="#配置个性化域名" class="headerlink" title="配置个性化域名"></a>配置个性化域名</h1><p>一顿操作下来，打开我们的博客还是：<font color="red" size="3"><a href="http://www.xxx.github.io" target="_blank" rel="noopener">www.xxx.github.io</a></font>，是不是很没有牌面？我们可以考虑购买一个专属域名，以后打开博客就是这样：<font color="red" size="3"><a href="http://www.xxx.com" target="_blank" rel="noopener">www.xxx.com</a> </font>。</p>
<p><a href="https://www.aliyun.com/" title="阿里云" target="_blank" rel="noopener">阿里云</a>和<a href="https://cloud.tencent.com/" title="腾讯云" target="_blank" rel="noopener">腾讯云</a>都可以，我的是腾讯云，购买域名后首先需要添加解析：</p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/24.png" alt></p>
<p><img src="https://cdn.jsdelivr.net/gh/MUYIio/CDN@1.5/Images/posts/1/25.png" alt></p>