Not Solved Show/Hide Info User on Postbit
#11
Not Solved
(2024-09-17, 09:10 PM)Mostafa.Shiraali Wrote:
(2024-09-17, 04:02 PM)SELLECK87 Wrote:
(2024-09-17, 01:43 PM)Mostafa.Shiraali Wrote:
(2024-09-17, 12:47 PM)SELLECK87 Wrote: Perhaps I have explained myself wrongly. I meant some kind of spoiler in the user info in the postbit. I have seen that some people use bootstrap but if I activate it in my forum all the tables change.

you mean you want be able hid/show info with a button in postbit?
if yes you can add button with css you want or a div element , then with Jquery on click toggle display elements status.
for example :
1. you add a element in postbit element
<button id="togglepostbit">Show/hid<button>
2. add below jquery code before </header> tag in showthread template (if you want for only showthread)
			<script type="text/javascript">
			$('# togglepostbit').on('click',  function (e) {
				e.preventDefault();
				$('#togglepostbit').toggle();			});
			</script>

in my showthread template there is no </header>.

yes that is head tag , sorry for typo , and button not work for you because you are using classname , so for classname you must change jquery selector from
 $('# togglepostbit') 
to
 $('.togglepostbit')
# comes before ID
. comes before ClassName

			<script type="text/javascript">
			$('.togglepostbit').on('click',  function (e) {
				e.preventDefault();
				$('.togglepostbit').toggle();			});
			</script>


I did this but the button still didn't go. I have the same result as in the previous photo.
Reply
#12
Not Solved
(2024-09-17, 02:01 PM)lost puppy Wrote: You could use the HTML Summary tag.

Change the .... Template Sets >> "Your Templates" >> Post Bit Templates >> postbit_author_user

to:

<details>
	<style>.show-user-details {cursor: help;}</style>
  <summary class="show-user-details">Details</summary>
	{$lang->postbit_posts} {$post['postnum']}<br />
	{$lang->postbit_threads} {$post['threadnum']}<br />
	{$lang->postbit_joined} {$post['userregdate']}
	{$post['replink']}{$post['profilefield']}{$post['warninglevel']}
</details>

The style is just changing the cursor/pointer .... a choice here:
https://www.w3schools.com/cssref/pr_class_cursor.php
this is bad for SEO , because P is for Paragraph and Summary is clear from the name this way you are confusing the search engine , and with dulicated postbit stored in SE as duplicated content , so .....

oh ,sorry I did not changed second ID

<script type="text/javascript">
$('# togglepostbit').on('click',  function (e) {
e.preventDefault();
$('#postbitbox').toggle(); });
</script>
first is for button and second is for box you want show/hide
Reply
#13
Not Solved
(2024-09-17, 09:21 PM)Mostafa.Shiraali Wrote:
(2024-09-17, 02:01 PM)lost puppy Wrote: You could use the HTML Summary tag.

Change the .... Template Sets >> "Your Templates" >> Post Bit Templates >> postbit_author_user

to:

<details>
	<style>.show-user-details {cursor: help;}</style>
  <summary class="show-user-details">Details</summary>
	{$lang->postbit_posts} {$post['postnum']}<br />
	{$lang->postbit_threads} {$post['threadnum']}<br />
	{$lang->postbit_joined} {$post['userregdate']}
	{$post['replink']}{$post['profilefield']}{$post['warninglevel']}
</details>

The style is just changing the cursor/pointer .... a choice here:
https://www.w3schools.com/cssref/pr_class_cursor.php
this is bad for SEO , because P is for Paragraph and Summary is clear from the name this way you are confusing the search engine , and with dulicated postbit stored in SE as duplicated content , so .....


This is HTML code .... literally written into the HTML .... Are you telling me that BASE HTML code will confuse search engines?

I would have thought that adding additional code (which includes non required languages) would be much more likely to confuse search engines?

The "Summary " tag is a part of HTML!
Reply
#14
Not Solved
<button id="togglepostbit">Show/Hide<button>
   
    {$lang->postbit_posts} {$post['postnum']}<br />
	{$lang->postbit_threads} {$post['threadnum']}<br />
	%%TYL_NUMTHANKEDLIKED%%<br />
	{$lang->postbit_joined} {$post['userregdate']}
	{$post['replink']}{$post['profilefield']}{$post['warninglevel']}

is this correct? because that still doesn't work for me.
Reply
#15
Not Solved
(2024-09-17, 09:28 PM)lost puppy Wrote:
(2024-09-17, 09:21 PM)Mostafa.Shiraali Wrote:
(2024-09-17, 02:01 PM)lost puppy Wrote: You could use the HTML Summary tag.

Change the .... Template Sets >> "Your Templates" >> Post Bit Templates >> postbit_author_user

to:

<details>
	<style>.show-user-details {cursor: help;}</style>
  <summary class="show-user-details">Details</summary>
	{$lang->postbit_posts} {$post['postnum']}<br />
	{$lang->postbit_threads} {$post['threadnum']}<br />
	{$lang->postbit_joined} {$post['userregdate']}
	{$post['replink']}{$post['profilefield']}{$post['warninglevel']}
</details>

The style is just changing the cursor/pointer .... a choice here:
https://www.w3schools.com/cssref/pr_class_cursor.php
this is bad for SEO , because P is for Paragraph and Summary is clear from the name this way you are confusing the search engine , and with dulicated postbit stored in SE as duplicated content , so .....


This is HTML code .... literally written into the HTML .... Are you telling me that BASE HTML code will confuse search engines?

I would have thought that adding additional code (which includes non required languages) would be much more likely to confuse search engines?

The "Summary " tag is a part of HTML!

every HTML tag has a special meaning for the search engine , I never told you " HTML code will confuse search engines " , I meant Postbit is not the right place for the Summary tag for example for article title you must use <H> tag , and depend on number H you For the search engine, you specify that, for example, this is the title of the article, or titles that are part of the article itself

(2024-09-17, 09:37 PM)SELLECK87 Wrote:
<button id="togglepostbit">Show/Hide<button>
   
    {$lang->postbit_posts} {$post['postnum']}<br />
	{$lang->postbit_threads} {$post['threadnum']}<br />
	%%TYL_NUMTHANKEDLIKED%%<br />
	{$lang->postbit_joined} {$post['userregdate']}
	{$post['replink']}{$post['profilefield']}{$post['warninglevel']}

is this correct?  because that still doesn't work for me.
no ,because you not defined second ID and I think I  I did not explain well
you put information to div element like this

<button id="togglepostbit">Show/Hide<button>

<div id="postbitbox">    
 {$lang->postbit_posts} {$post['postnum']}<br />
 {$lang->postbit_threads} {$post['threadnum']}<br />
%%TYL_NUMTHANKEDLIKED%%<br />
{$lang->postbit_joined} {$post['userregdate']}
{$post['replink']}{$post['profilefield']}{$post['warninglevel']} 
</div>
and Jquery code is like this
$('#togglepostbit').on('click',  function (e) {
e.preventDefault();
$('#postbitbox').toggle();
});
in jquery code #togglepostbit  is ID of element that you click on it and postbitbox is ID and element you want show and hid each time on click

this is code in codepen
Reply
#16
Not Solved
Very strange. I followed the directions but it still doesn't work. I must be clumsy Big Grin
Reply
#17
Not Solved
(2024-09-17, 10:27 PM)SELLECK87 Wrote: Very strange. I followed the directions but it still doesn't work. I must be clumsy Big Grin

your website URL?
Reply
#18
Not Solved
(2024-09-17, 10:36 PM)Mostafa.Shiraali Wrote:
(2024-09-17, 10:27 PM)SELLECK87 Wrote: Very strange. I followed the directions but it still doesn't work. I must be clumsy Big Grin

your website URL?

Done. Now can you check if I have done something wrong?  Smile
Reply
#19
Not Solved
based on tag position , change Jquery code to this

$(document).ready(function() {
$('#togglepostbit').on('click',  function (e) {
e.preventDefault();
$('#postbitbox').toggle();
});

});
and remove button as partent of <div id="postbitbox"> element , I meant you code is like
<button>

<div id="postbitbox">  
... 
</div>
</button>
remove button element as parent of div
first change solve your problem,second change is SEO Tip , and after change in showthread page use CTRL + F5 to clear browser cache

also if you want change show display with custom display you can change code like this

$(document).ready(function() {
$('#togglepostbit').on('click',  function (e) {
e.preventDefault();

    if ($('#postbitbox').css('display') == 'block') {
        $('#postbitbox').hide();
    } else {
	   $('#postbitbox').css( "display", "flex" );
    }


});

});

also for hide you can use fadeIn and fadeOut and other Jquery functions that you can find in here
Reply


Forum Jump:


Users browsing this thread: 1 Guest(s)