增加的分享按纽不显示

文強

代码有点多，不妨参考一下我论坛的分享（位置和图标可以在css里自己调整）→ https://boonkiong.com/thread-3926-1-1.html

文強

我用的背景是动态壁纸来的，可以放在后台\全局\SEO设置\其他\其他头部信息，或是直接放到header模板里也可以。

1. <video src="https://boonkiong.com/video/A_long_Way.mp4"class="bjimg" autoplay="true" loop="true" muted="true"></video>

复制代码

然后你需要在 template\default\common\common.css 里添加代码。

1. .bjimg {
   
2. position: fixed;   
   
3. top: 0;
   
4. left: 0;
   
5. width: 100%;
   
6. height:100%;
   
7. overflow: hidden;
   
8. z-index: -10;
   
9. object-fit: cover;
   
10. }

复制代码

文強

那个渐变字体需要在 template\default\common\common.css 里添加代码

1. 
   
2.             #postmessage_37985{
   
3. font-size: 22px;
   
4.                 color: #8c888b;
   
5. background: -webkit-linear-gradient(45deg,#00f2ff,#ff5200,#ffd300,#4000ff,#006bff);
   
6.                 -moz-linear-gradient(45deg,#00f2ff,#ff5200,#ffd300,#4000ff,#006bff);
   
7.                 -ms-linear-gradient(45deg,#00f2ff,#ff5200,#ffd300,#4000ff,#006bff);
   
8.                 color: transparent;
   
9.                 -webkit-background-clip: text;
   
10.                 animation: ran 50s linear infinite;
    
11.             }
    
12.             @keyframes ran {
    
13.                 from {
    
14.                     backgroud-position: 0 0;
    
15.                 }
    
16.                 to {
    
17.                     background-position: 9000px 0;
    
18.                 }
    
19.             }

复制代码

然后看你需要让那些字体渐变，例如模板字体里的h1,然后添加代码给h1运行。

1. h1 {
   
2.     color: #8c888b;
   
3.     background: -webkit-linear-gradient(45deg,#00f2ff,#ff5200,#ffd300,#4000ff,#006bff);
   
4.     -moz-linear-gradient(45deg,#00f2ff,#ff5200,#ffd300,#4000ff,#006bff): ;
   
5.     -ms-linear-gradient(45deg,#00f2ff,#ff5200,#ffd300,#4000ff,#006bff): ;
   
6.     color: transparent;
   
7.     -webkit-background-clip: text;
   
8.     animation: ran 150s linear infinite;
   
9. }

复制代码

ran 150s 是速度，自己调整。

文強

TaC 发表于 2023-4-23 21:59
先回复你这个分享代码的测试结果。
我试了下，跟我的一样，除了出现“分享到”这三个字以外，图标都不显 ...

你要加入css代码它才会显示，因为css代码里带有图标，你的代码里只有js都没图标它怎么显示？

文強

TaC 发表于 2023-4-23 22:12
这一块我看得不是很明白，CSS里添加代码我倒是清楚，可让哪些字体渐变，模板字体h1这些看得有点迷糊。
在 ...

h1大多数都是那些标题，而且h1只是个举例，你可以在需要的字体添加

1. [b1]渐变字体[/b1]

复制代码

然后在css里添加

1. b1 {
   
2.     color: #8c888b;
   
3.     background: -webkit-linear-gradient(45deg,#00f2ff,#ff5200,#ffd300,#4000ff,#006bff);
   
4.     -moz-linear-gradient(45deg,#00f2ff,#ff5200,#ffd300,#4000ff,#006bff): ;
   
5.     -ms-linear-gradient(45deg,#00f2ff,#ff5200,#ffd300,#4000ff,#006bff): ;
   
6.     color: transparent;
   
7.     -webkit-background-clip: text;
   
8.     animation: ran 150s linear infinite;
   
9. }

复制代码