我的 firefox 扩展不会在浏览器工具栏中加载

问题描述 投票:0回答:0

我最近创建了一个供个人使用的快速启动扩展。它被 firefox 成功接受到他们的附加组件平台上,但是当我下载它并试图在工具栏中打开它时,我收到以下消息:“无法读取和更改此站点上的数据”。我真的不知道该怎么办。我尝试修复清单文档,但没有用。有人可以看看我的代码,请告诉我我哪里出错了:

P.S 如你所知,我是菜鸟

img:this is the message the extension currently gives me when i try to use it

代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Yalwa Launcher</title>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans" type="text/css">
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">

    <style>
        html, body{
            font-family: 'Poppins', sans-serif;
            font-size: 14px;
            margin: 0;
            min-height: 180px;
            padding: 0;
            width: 384px;
            border-radius: 10px;
        }

        h1{
            font-family: 'Menlo', monospace;
            font-size: 22px;
            font-weight: 400;
            margin: 0;
            color: #2f5876;
        }

        a:link, a:visited{
            color: #000;
            outline: 0;
            text-decoration: none;
        }

        img{
            width: 30px;
        }

        .modal-header{
            text-align: center;
            align-items: center;
            border-bottom: 0.5px solid #dadada;
        }

        .modal-content{
            text-align: center;
            padding: 0 22px;
            color: rgb(245, 161, 4);
        }

        .modal-icons{
            border-top: 0.5px solid #dadada;
            height: 50px;
            width: 100%;
        }

        .logo{
            padding: 16px;
        }

        .logo-icon{
            vertical-align: text-bottom;
            margin-right: 12px;
        }

        .version{
            color: rgb(98, 16, 252);
            font-size: 18px;
        }

        .flex-container{
            text-align: center;
            display: flex;
            justify-content: space-between;
            padding: 10px 22px;
        }

        .flex{
            opacity: 1;
            transition: opacity 0.2 ease-in-out;
            width: 120px;
        }

        .flex:hover{
            opacity: 0.5;
        }

        .flex .fa{
            font-size: 40px;
            background: -webkit-gradient(linear, left top, left bottom, from(rgb(20, 4, 253)), to(rgba(15, 147, 255, 0.685)));
            -webkit-background-clip: text;
            background-clip: text;
            -webkit-text-fill-color: transparent;
            display: initial; /* reset Font Awesome's display:inline-block */

        }

    </style>

<div class="modal-header">
    <h1 class="logo">
      <img src="images/yalwa_logo.png.png" alt="Yalwa Launcher" class="logo-icon">YALWA Launcher <span class="version">1.1.0</span>
    </h1>
  </div> 
  <div class="modal-content">
    <p>Express YALWA Launcher</p>
  </div>
  <div class="modal-icons">
    <div class="flex-container">
      <div class="flex">
        <a href="https://example.com" target="_blank">
          <i class="fa fa-adn"></i>
        </a>
      </div>
      <div class="flex">
        <a href="https://example.com" target="_blank">
          <i class="fa fa-picture-o"></i>
        </a>
      </div>
      <div class="flex">
        <a href="https://example.com" target="_blank">
          <i class="fa fa-file-pdf-o"></i>

如果您需要查看 manifes.json,请告诉我,谢谢!

我希望扩展程序打开以显示其中编码的选项,就像上面的照片enter image description here

firefox browser firefox-addon toolbar
© www.soinside.com 2019 - 2024. All rights reserved.