将字体添加到Q2A页面表单按钮

Question

这些不仅仅是我所谈论的任何按钮......而是每个问题或答案下面的按钮说＆＃34;编辑＆＃34;，＆＃34;标记＆＃34;，＆＃34;问相关问题＆＃34;，＆＃34;回答＆＃34;等等。

这些按钮均位于父div＆＃34; qa-q-view-buttons＆＃34; ..

下

以此部分为例......

以下是现在的样子：

以及现在看起来像的HTML ......

<div class="qa-q-view-buttons">
<input name="q_doedit" value="edit" title="Edit this question" type="submit" class="qa-form-light-button qa-form-light-button-edit">
<input name="q_doclose" value="close" title="Close this question to any new answers" type="submit" class="qa-form-light-button qa-form-light-button-close">
<input name="q_dohide" onclick="qa_show_waiting_after(this, false);" value="hide" title="Hide this question" type="submit" class="qa-form-light-button qa-form-light-button-hide">
<input name="q_doanswer" id="q_doanswer" onclick="return qa_toggle_element('anew')" value="answer" title="Answer this question" type="submit" class="qa-form-light-button qa-form-light-button-answer">
</div>

通过一些简单的HTML编辑..我能够非常轻松地将Font Awesome添加到这些按钮。

我可以做一些修改，完全按照自己的意愿行事。

<div class="qa-q-view-buttons">
<button name="q_doedit" value="edit" title="Edit this question" type="submit" class="qa-form-light-button qa-form-light-button-edit">
<i class="fa fa-edit"></i> Edit</button>
<button name="q_doclose" value="close" title="Close this question to any new answers" type="submit" class="qa-form-light-button qa-form-light-button-close">
<i class="fa fa-close"></i> Close </button>
<button name="q_dohide" onclick="qa_show_waiting_after(this, false);" value="hide" title="Hide this question" type="submit" class="qa-form-light-button qa-form-light-button-hide">
<i class="fa fa-eye-slash"></i> Hide</button>
<button name="q_doanswer" id="q_doanswer" onclick="return qa_toggle_element('anew')" value="answer" title="Answer this question" type="submit" class="qa-form-light-button qa-form-light-button-answer">
<i class="fa fa-comment"></i> Comment</button>
</div>

最终看起来像这样..

唯一的问题？ Q2A不能直接进行HTML编辑。我在＆＃34; Inspect Element＆＃34;中进行了这些更改。 - ＆GT; ＆＃34;编辑为HTML＆＃34; Google Chrome上的源代码编辑器部分。这意味着我需要对Q2A的qa-theme-base.php文件进行排序，并使用PHP代码直接编辑它，对吗？

有人能指出我正确的方向吗？我不知道从哪里开始。

Answer 1

要将图标添加为<i class="fa fa-edit"></i>，您需要在生成此按钮的代码的任何位置更改PHP文件（我无法记住现在的位置），以便添加<i class> 1}}。但是，不是使用<i>默认情况下建议实现图标的方式，您可以随时使用黑客来执行相同操作，而不是使用<i>标记，您可以将其用作:before用于要实现这些图标的类

这将是这样的：

＆＃13;

＆＃13;

.qa-form-light-button-edit:before {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    content: "\f040";
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    
    margin-right:3px; /* Add a margin if you want */

    /* code below same as Font-awesome .fa-fw for 'navigation' icons */
    width: 1.28571429em;
    text-align: center;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<!-- example of normal Q2A Edit button below -->
<button name="q_doedit" value="edit" title="Edit this question" type="submit" class="qa-form-light-button qa-form-light-button-edit">Edit</button>

＆＃13;

＆＃13;

＆＃13;