YOURLS(Your Own URL Shortener)是一个开源的URL缩短工具,它允许用户创建自己的URL短链接服务。

官方网站:https://yourls.org/

GitHub地址:https://github.com/YOURLS/YOURLS

dockerHub地址:https://hub.docker.com/_/yourls

安装

docker-compose

  mysql:
    image: mysql:5.7.22
    environment:
      - MYSQL_ROOT_PASSWORD=ROOT密码
      - MYSQL_DATABASE=yourls
      - MYSQL_USER=yourls
      - MYSQL_PASSWORD=密码
    volumes:
      - /data/mysql/db/:/var/lib/mysql
      - /data/mysql/conf/:/etc/mysql/conf.d
    restart: always
    container_name: mysql
  yourls:
    image: yourls
    restart: always
    ports:
      - "8200:80"
    environment:
      YOURLS_DB_HOST: mysql
      YOURLS_DB_USER: yourls
      YOURLS_DB_PASS: 密码
      YOURLS_DB_NAME: yourls
      YOURLS_USER: 用户名
      YOURLS_PASS: 密码
      YOURLS_SITE: https://t.xxx.com
      YOURLS_HOURS_OFFSET: 8
    volumes:
      - /data/yourls/:/var/www/html   
    container_name: yourls
    links:
      - mysql:mysql

安装

进入地址https://t.xxx.com/admin

进行安装

2023-12-22T11:34:18.866750299-vzan.webp2023-12-22T11:35:14.045217417-vtra.webp

安装主题

主题地址:https://github.com/Flynntes/Sleeky

Sleeky 主题包括前端和后台两个部分。

下载解压 Sleeky 主题后可以看到两个文件夹 sleeky-frontend 和 sleeky-backend。

前端只需要将 sleeky-frontend 中的文件复制到 yourls 网站根目录即可。

后端则需要将 sleeky-backend 文件夹放到 yourls 目录下的 user/plugins 中,然后在后台管理 (t.xxx.com/admin/plugins.php) 中启动主题插件即可看到效果。

设置文件夹权限

chown -R www-data.www-data /data/yourls/user/plugins/sleeky-backend
chown -R www-data.www-data /data/yourls/index.php /data/yourls/frontend/

修改sleeky-frontend文件解决样式问题

vi /data/yourls/frontend/config.php
#增加一个NULL值变量
$YOURLS_SITE = null;

激活主题

在后台插件管理点击激活主题

2023-12-22T11:42:58.617125314-znxv.png激活后效果

2023-12-22T11:44:04.163303964-lfmo.png其他插件

Random ShortURLs 选择激活,否则短链接默认按自增数字生成。

跳转页面美化

includes/functions.php 第44行,修改为

        echo <<<REDIR
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width">
<meta http-equiv="refresh" content="2;url='$location';">
<meta charset="UTF-8">
<!--[if IE 8]>
<style>
.ie8 .alert-circle,.ie8 .alert-footer{display:none}.ie8 .alert-box{padding-top:75px}.ie8 .alert-sec-text{top:45px}
</style>
<![endif]--><title>页面加载中,请稍候...</title>

<style type="text/css">body{margin:0;height:100vh;display:flex;align-items:center;justify-content:center;background:#222428}.container{width:8em;height:1em;font-size:35px;display:flex;justify-content:space-between}.container span{width:1em;height:1em;--duration:1.5s}.girl{animation:slide var(--duration) ease-in-out infinite alternate}@keyframes slide{0%{transform:translateX(0);filter:brightness(1)}to{transform:translatex(6.75em);filter:brightness(1.45)}}.boys{width:6em;display:flex;justify-content:space-between}.boys span{animation:var(--duration) ease-in-out infinite alternate}.boys span:nth-child(1){animation-name:jump-off-1}.boys span:nth-child(2){animation-name:jump-off-2}.boys span:nth-child(3){animation-name:jump-off-3}.boys span:nth-child(4){animation-name:jump-off-4}@keyframes jump-off-1{0%,15%{transform:rotate(0deg)}35%,to{transform-origin:-50% center;transform:rotate(-180deg)}}@keyframes jump-off-2{0%,30%{transform:rotate(0deg)}50%,to{transform-origin:-50% center;transform:rotate(-180deg)}}@keyframes jump-off-3{0%,45%{transform:rotate(0deg)}65%,to{transform-origin:-50% center;transform:rotate(-180deg)}}@keyframes jump-off-4{0%,60%{transform:rotate(0deg)}80%,to{transform-origin:-50% center;transform:rotate(-180deg)}}.container span:before{content:'';position:absolute;width:inherit;height:inherit;border-radius:15%;box-shadow:0 0 .1em rgba(0,0,0,.3)}.girl:before{background-color:hotpink}.boys span:before{background-color:#1e90ff;animation:var(--duration) ease-in-out infinite alternate}.boys span:nth-child(1):before{filter:brightness(1);animation-name:jump-down-1}.boys span:nth-child(2):before{filter:brightness(1.15);animation-name:jump-down-2}.boys span:nth-child(3):before{filter:brightness(1.3);animation-name:jump-down-3}.boys span:nth-child(4):before{filter:brightness(1.45);animation-name:jump-down-4}@keyframes jump-down-1{5%{transform:scale(1,1)}15%{transform-origin:center bottom;transform:scale(1.3,0.7)}20%,25%{transform-origin:center bottom;transform:scale(0.8,1.4)}40%{transform-origin:center top;transform:scale(1.3,0.7)}55%,to{transform:scale(1,1)}}@keyframes jump-down-2{20%{transform:scale(1,1)}30%{transform-origin:center bottom;transform:scale(1.3,0.7)}35%,40%{transform-origin:center bottom;transform:scale(0.8,1.4)}55%{transform-origin:center top;transform:scale(1.3,0.7)}70%,to{transform:scale(1,1)}}@keyframes jump-down-3{35%{transform:scale(1,1)}45%{transform-origin:center bottom;transform:scale(1.3,0.7)}50%,55%{transform-origin:center bottom;transform:scale(0.8,1.4)}70%{transform-origin:center top;transform:scale(1.3,0.7)}85%,to{transform:scale(1,1)}}@keyframes jump-down-4{50%{transform:scale(1,1)}60%{transform-origin:center bottom;transform:scale(1.3,0.7)}65%,70%{transform-origin:center bottom;transform:scale(0.8,1.4)}85%{transform-origin:center top;transform:scale(1.3,0.7)}to{transform:scale(1,1)}}
</style>

</head>
<body>

<div class="container">
  <span class="girl"></span>
  <div class="boys">
    <span></span>
    <span></span>
    <span></span>
    <span></span>
  </div>
</div>

</body>
</html>
REDIR;

跳转加载效果图

2023-12-22T14:45:47.524243451-ylbc.png