For my custom settings field, I am looking to insert it right after the Site Address (URL) field in the General settings page.
I'm able to add the custom field sucessfully using the add_settings_field()
. Be default, it add the custom field at the bottom. Using jQuery, I was able to display my custom field after the Site Address (URL):
add_action( 'admin_footer', 'wpse_243810_admin_footer' );
function wpse_243810_admin_footer() {
?>
<script type="text/javascript">
jQuery('#protocol_relative').closest('tr').insertAfter('#home-description').closest('tr');
</script>
<?php
}
However, it looks like the following instead:
Looking at the code, it inserts my custom field within the Site Address field's <tr>
element. How get I have it inserted outide of it instead? Below are the seperate code snippets of each field.
<tr>
<th scope="row"><label for="home">Site Address (URL)</label></th>
<td>
<input name="home" type="url" id="home" aria-describedby="home-description" value="http://example.com" class="regular-text code">
<p class="description" id="home-description">Enter the address here if you <a href="//codex.wordpress.org/Giving_WordPress_Its_Own_Directory">want your site home page to be different from your WordPress installation directory.</a></p>
</td>
</tr>
This is the custom field that my plugin generates which I want ot insert after:
<tr>
<th scope="row">Protocol Relative URL</th>
<td>
<fieldset>
<legend class="screen-reader-text"><span>Protocol Relative URL</span></legend>
<label for="remove_http">
<input name="protocol_relative" type="checkbox" id="protocol_relative" value="1" checked="checked">Do not apply to external links
</label>
<p class="description">Only the internal links will be affected.</p>
</fieldset>
</td>
</tr>