By Richard on Wednesday, 09 November 2016
Likes 0
Views 614
Votes 0
Ref this thread, does the Profile Header not work on smaller devices/mobile or is there a different file I need to override?

It works perfectly on desktop or large screen.
Hi Richard,

Unfortunately this social profile header is not responsive to smaller view (eg: mobile view) where it will looks like this: http://screencast.com/t/6nuYcYetyNuh
Where by default, it will not shows in the mobile view http://screencast.com/t/B6rfulbO
·
Wednesday, 09 November 2016 12:22
·
0 Likes
·
0 Votes
·
0 Comments
·
I understand.

The 'About the Author Section is included by adding this code:

<?php if ($this->entryParams->get('post_author_box', true)) { ?>
<?php echo $this->output('site/blogs/entry/author', array('post' => $post)); ?>
<?php } ?>

How can I adjust this code to make the 'About the Author' code appear only on smaller devices (the Profile Header appears on Desktop or above)?
·
Thursday, 10 November 2016 02:02
·
0 Likes
·
0 Votes
·
0 Comments
·
You could use the following codes to determine if it is a mobile device accessing the page currently,

[gist]
<?php if (ES::responsive()->isMobile()) { ?>
// Mobile contents appear here
<?php } ?>
[/gist]
·
Thursday, 10 November 2016 16:43
·
0 Likes
·
0 Votes
·
0 Comments
·
Thank you Mark.

For anyone following the 2 threads, I now have the following code in the ../templates/uber/com_easyblog/blogs/entry/default.php file just before the Related Posts code:


<?php echo $this->output('site/blogs/entry/navigation'); ?>
</div>

<?php
$exists = EB::easysocial()->exists();

if ($exists) {
ES::initialize();
$user = ES::user($post->getAuthor()->id);
?>
<div id="es" class="es">
<?php echo ES::themes()->html('html.miniheader', $user); ?>
</div>
<?php
}
?>

<?php if (ES::responsive()->isMobile()) { ?>
<?php if ($this->entryParams->get('post_author_box', true)) { ?>
<?php echo $this->output('site/blogs/entry/author', array('post' => $post)); ?>
<?php } ?>
<?php } ?>

<?php if ($this->entryParams->get('post_related', true) && $relatedPosts) { ?>

It allows the EasySocial Profile Header to appear after the Blog on Desktop or larger in place of the 'About the Author' Section and the 'default 'About the Author' Section to appear in smaller devices including mobile.
·
Thursday, 10 November 2016 21:59
·
0 Likes
·
0 Votes
·
0 Comments
·
Thanks for sharing this Richard, I will move this into the tips category
·
Thursday, 10 November 2016 22:16
·
0 Likes
·
0 Votes
·
0 Comments
·
View Full Post