带Wordpress的Particles.js

Question

我的particles.js不会加载我的WorpdPress自定义主题。控制台抛出此错误：

​

​

​

我找到了这个粒子效应的插件，但我不知道如何使用它:D，我想实现我自己的。所以，粒子工作得很好，直到我把我的网站变成了WordPress主题.很明显，JSON的file....how存在问题--我能绕开这个问题吗？

顺便说一句.它在localhost....would上.在服务器上会有什么不同吗？

Answer 1

好吧，所以我解决了这个问题。不确定这是否是解决方案，但对我起作用的是:我必须将JSON配置内联地放入自定义app.js文件中。然后起作用了。

当JSON配置位于一个单独的文件中时，WP在加载它时遇到了问题。它抛出404找不到。So....this为我工作..。

我在这里找到了解决方案：https://github.com/VincentGarreau/particles.js/issues/157

Answer 2

我所做的是将json设置包括在一个变量中，并将该代码放在您放置此代码的javascript文件中。

​

particlesJS.load('particles-js', 'assets/particles.json', function() {
console.log('callback - particles.js config loaded');
});

​

但我没有使用particlesJS.load，只有particlesJS。所以它看起来就像这样

​

var config = {
  particles: {
    number: {
      value: 100
    },
    color: {
      value: "#d4d4d4"
    },
    shape: {
      type: "circle",
      stroke: {
        width: 0,
        color: "#d4d4d4"
      },
      polygon: {
        nb_sides: 5
      }
    },
    opacity: {
      value: 0.5,
      random: false,
      anim: {
        enable: false,
        speed: 1,
        opacity_min: 0.1,
        sync: false
      }
    },
    size: {
      value: 3,
      random: true,
      anim: {
        enable: false,
        speed: 40,
        size_min: 0.1,
        sync: false
      }
    },
    line_linked: {
      enable: true,
      distance: 150,
      color: "#d4d4d4",
      opacity: 0.4,
      width: 1
    },
    move: {
      enable: true,
      speed: 2,
      direction: "none",
      random: false,
      straight: false,
      out_mode: "out",
      attract: {
        enable: false,
        rotateX: 600,
        rotateY: 1200
      }
    }
  },
  retina_detect: true
}

particlesJS("your-id-or-class", config, function () {})

​