Blog Element – Move Date above Post Title

Hey jomo5280,

You can try 2 different solutions
One with CSS

and one with some JS
https://kriesi.at/support/topic/move-date-below-title-in-magazine-element/

Best regards,
Basilis

Hi Dependable,

What Blog Style are you using?
If you’re using Grid Layout then please add this code in your child theme’s functions.php file:

function move_post_meta(){
?>
<script>
(function() {
	var gridposts = document.querySelectorAll('.avia-content-slider .slide-entry');

	gridposts.forEach(function(el) {
		var header = el.querySelector('.entry-content-header');
		var postMeta = el.querySelector('.slide-meta');
		header.insertBefore(postMeta, header.childNodes[1]);
	});
})();
</script>
<?php
}
add_action('wp_footer', 'move_post_meta');

Then go to Enfold > General Styling > Quick CSS, then add this CSS code:

#top .slide-content .slide-entry-title {
    margin-bottom: 0;
    padding-bottom: 0;
}

#top .slide-content .slide-meta {
    margin: 0;
    padding: 0;
    float: none;
}

#top .slide-content .blog-categories {
    top: 0 !important;
    margin-bottom: 12px;
}

Let us know if this helps.

Best regards,
Nikko

Hi Brad,

Please post us your login credentials (in the “private data” field), so we can take a look at your backend.

1. Install and activate ” Temporary Login Without Password “.
2. Go to ” Users > Temporary Logins ” on the left-side menu.
3. Click ” Create New “.
4. Add the email address for the account ( you can use (Email address hidden if logged out) ), as well as the ” Role ” making that the highest possible and the expiry about four days
   ( to be sure that we have enough time to debug ).
5. Click ” Submit “.
6. You’ll now have a temporary account. Please provide us here in the private section the URL, so we can login and help you out.

When your issue is fixed, you can always remove the plugin!
If you prefer to not use the plugin, you can manually create an admin user and post the login credentials in the “private data” field.

Best regards,
Nikko

Hi Dependable,

Thanks can you try to change the code I gave to this one:

function move_post_meta(){
?>
<script>
(function() {
	var gridposts = document.querySelectorAll('.avia-content-slider .slide-entry');

	gridposts.forEach(function(el) {
		var header = el.querySelector('.entry-content-header');
		var postMeta = el.querySelector('.slide-meta');
		header.insertBefore(postMeta, header.childNodes[0]);
	});
})();
</script>
<?php
}
add_action('wp_footer', 'move_post_meta');

Best regards,
Nikko

Hi Brad,

I tried to check on the PHP code (link) but it returns:

Sorry, you are not allowed to access this page.

Then I checked on the site and it seems it’s still using the old code. (screenshot in private content)
The new one has 0 inside it and not 1:

header.insertBefore(postMeta, header.childNodes[0]);

Best regards,
Nikko

• This reply was modified 3 years, 8 months ago by Nikko.

Hi Dependable,

It may just be due to cache.
I checked it just now and it seems to be working properly (please check the screenshot in private content).

Best regards,
Nikko

Hi Dependable,

For single posts, you can use this code:

function move_single_post_meta(){
    if (is_single()):
        ?>
        <script>
            (function() {
                var header = document.querySelector('.single-post .entry-content-header');
                var postMeta = header.querySelector('.post-meta-infos');
                header.insertBefore(postMeta, header.childNodes[0]);
            })();
        </script>
        <?php
    endif;
}

add_action('wp_footer', 'move_single_post_meta');

Best regards,
Nikko