Question

我正在使用带有二十主题的wodpress 5.2。这意味着古腾堡生成的内容在很多地方都被破坏了。我可以在儿童主题CSS中修复许多问题，但我希望嵌入式图像看起来像旧的图像。我正在寻找一种简洁的方法来继承内置图像块提供的内容，并使用相同的编辑器选项制作自定义图像，但对该块所生成的HTML片段进行了少许修改，将自定义类应用于figure和figcaption首先。

Answer 1

（至少）您有两个选择。

制作自己的方块

您可以在github上抓取code of the image block并开始从中创建自己的代码块，例如使用create-guten-block。您将需要一些时间（〜1-2h）使其生效，因为必须修改某些import语句和其他内容，不仅是复制和过去。

=>如果需要对图像块可以提供的功能进行大量自定义，并且想要深入了解块创建的核心，更改功能，行为，外观等任何内容，请使用它。

在过滤器中编辑现有块

Gutenberg提供了许多新的过滤器，例如<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script> <div class="container"> <div class="row"> <div class="col"> <div class="example"> ... Example ... </div> <div class="example"> ... Example ... </div> <div class="example"> ... Example ... </div>  <table class="table table-striped table-hover table-sm"> <thead> <tr> <th scope="col">#</th> <th scope="col">First</th> <th scope="col">Last</th> <th scope="col">Handle</th> </tr> </thead> <tbody> <tr> <th scope="row">1</th> <td>Mark</td> <td>Otto</td> <td>@mdo</td> </tr> <tr> <th scope="row">2</th> <td>Jacob</td> <td>Thornton</td> <td>@fat</td> </tr> <tr> <th scope="row">3</th> <td>Larry</td> <td>the Bird</td> <td>@twitter</td> </tr> <tr> <th scope="row">1</th> <td>Mark</td> <td>Otto</td> <td>@mdo</td> </tr> <tr> <th scope="row">2</th> <td>Jacob</td> <td>Thornton</td> <td>@fat</td> </tr> <tr> <th scope="row">3</th> <td>Larry</td> <td>the Bird</td> <td>@twitter</td> </tr> <tr> <th scope="row">1</th> <td>Mark</td> <td>Otto</td> <td>@mdo</td> </tr> <tr> <th scope="row">2</th> <td>Jacob</td> <td>Thornton</td> <td>@fat</td> </tr> <tr> <th scope="row">3</th> <td>Larry</td> <td>the Bird</td> <td>@twitter</td> </tr> <tr> <th scope="row">1</th> <td>Mark</td> <td>Otto</td> <td>@mdo</td> </tr> <tr> <th scope="row">2</th> <td>Jacob</td> <td>Thornton</td> <td>@fat</td> </tr> <tr> <th scope="row">3</th> <td>Larry</td> <td>the Bird</td> <td>@twitter</td> </tr> <tr> <th scope="row">1</th> <td>Mark</td> <td>Otto</td> <td>@mdo</td> </tr> <tr> <th scope="row">2</th> <td>Jacob</td> <td>Thornton</td> <td>@fat</td> </tr> <tr> <th scope="row">3</th> <td>Larry</td> <td>the Bird</td> <td>@twitter</td> </tr> </tbody> </table> <div class="example"> ... Example ... </div> <div class="example"> ... Example ... </div> <div class="example"> ... Example ... </div>  </div> </div> </div>过滤器。它使您可以操作块属性，例如类。

Option Explicit

Sub WbClkMe()

Dim IE As New SHDocVw.InternetExplorer
Dim HTMLDoc As MSHTML.HTMLDocument
Dim HTMLInput As MSHTML.IHTMLElement
Dim HTMLButton As MSHTML.IHTMLElement

IE.Visible = True

IE.navigate "https://apiweb.biomerieux.com/login"

Do While IE.readyState <> READYSTATE_COMPLETE

Loop

Set HTMLDoc = IE.document

Set HTMLInput = HTMLDoc.getElementById("signupEmail") ' This is based on on your website

HTMLInput.Value = "" 'Put the value of Usernamae

Set HTMLInput = HTMLDoc.getElementById("signupPassword") 'This is based on on your website

HTMLInput.Value = "" 'Put the value of Password

Set HTMLButton = HTMLDoc.getElementById("signupSubmit") 'This is based on on your website

HTMLButton.Click


End Sub

扩展古登堡编辑器的内置图像块

1 个答案:

制作自己的方块

在过滤器中编辑现有块