Richie JS version 1.1.4 🚀

Profile page (ProfilePage)

What is profile page rich result?

ProfilePage markup is intended for sites where creators, whether individuals or organizations, share their firsthand perspectives. It aids Google Search in highlighting details about the creator, such as their name or social handle, profile photo, follower count, and the popularity of their content. Google Search also utilizes this markup for distinguishing the creator and in features like Perspectives, Discussions, and Forums.

Kindly Refer Google Doc (opens in a new tab) to know more about profile page rich result.

What are necessary data for profile page rich result?

1. Name

profilepage.html
<div>
 
  <p class="rjs-pp-name">DARSAN</p>
 
</div>

2. Alternative name

profilepage.html
<div>
 
  <p class="rjs-pp-altname">iamspdarsan</p>
 
</div>

3. Identifier

profilepage.html
<div>
 
  <p class="rjs-pp-uid">@iamspdarsan</p>
 
</div>

4. Date created

⚠️
The date and time format should match the configuration in rjs.config.json under timeFormat to avoid parsing errors.
profilepage.html
<div>
 
  <p class="rjs-pp-pdt">2024-06-06 08:37 PM</p>
 
</div>

5. Date modified

⚠️
The date and time format should match the configuration in rjs.config.json under timeFormat to avoid parsing errors.
profilepage.html
<div>
 
  <p class="rjs-pp-mdt">2024-02-26 05:23 PM</p>
 
</div>

6. Social media links

profilepage.html
<div>
 
  <a href="https://www.instagram.com/iamspdarsan/" class="rjs-pp-rlink">instagram</a>
 
  <a href="https://www.linkedin.com/in/iamspdarsan/" class="rjs-pp-rlink">linkedin</a>
 
  <a href="https://www.youtube.com/iamspdarsan" class="rjs-pp-rlink">youtube</a>
 
</div>

7. Description

profilepage.html
<div>
 
  <p class="rjs-pp-desc">
    <b>Seasoned Web Developer</b> skilled in turning design concepts into flawless, high-performance websites. Proficient in multiple languages and frameworks, I excel in crafting clean, maintainable and user-centric code My expertise in <b>SEO and UI/UX</b> ensures captivating, user-focused experiences.
  </p>
 
</div>

8. Images

profilepage.html
<div>
 
  <img class="rjs-pp-img" src="https://cresteem.com/img/team/darsan.png" alt="">
 
</div>

9. Author works

profilepage.html
<div>
 
  <section id="example-author-works">
    
    <!-- work instance 1 -->
    <div class="rjs-pp-awork">
      
      <img class="timg" src="https://abcx.com/x.jpg" alt="">
      
      <p class="head">This is example 1 headline</p>
      
      <p class="pon">2024-06-06 08:37 PM</p>
      
      <a class="url" href="https://www.example.com/article-1">Read More</a>
 
    </div>
    
    <!-- work instance 2 -->
    <div class="rjs-pp-awork">
      
      <img class="timg" src="https://abcx.com/x.jpg" alt="">
    
      <p class="head">This is example 2 headline</p>
      
      <p class="pon">2024-06-09 11:27 PM</p>
      
      <a class="url" href="https://www.example.com/article-2">Read More</a>
    
    </div>
    
  </section><!-- author works ended -->
 
</div>

10. Number of posts by author

profilepage.html
<div>
 
  <p>
    Posts Written By Author:
    <span class="rjs-pp-aposts">87</span>
  </p>
 
</div>

11. Number of likes by author

profilepage.html
<div>
 
  <p>
    Posts Liked By Author:
    <span class="rjs-pp-aliked">1002</span>
  </p>
 
</div>

12. Number of users author follows

profilepage.html
<div>
 
  <p>
    Author Follows:
    <span class="rjs-pp-afollows">35</span>
  </p>
 
</div>

13. Number of item shared by author

profilepage.html
<div>
 
  <p>
    Shared/Reposted Contents:
    <span class="rjs-pp-ashared">30</span>
  </p>
 
</div>

14. Number of followers

profilepage.html
<div>
 
  <p>
    Author Followers:
    <span class="rjs-pp-followers">391080</span>
  </p>
 
</div>

15. Number of likes

profilepage.html
<div>
 
  <p>
    Cummulative Likes:
    <span class="rjs-pp-likes">9873221</span>
  </p>
 
</div>

16. Number of mutual connection

profilepage.html
<div>
 
  <p>
    Mutual Connections:
    <span class="rjs-pp-bicon">33</span>
  </p>
 
</div>

Function and parameters

đź’ˇ
By default input file is overwriiten with result so destination is optional
This is only for API method. We prefer CLI method for keeping it simpler (refer - Working with API & CLI).
func_params.js
const richResultType = 'profile';
const filePath = 'profilepage.html';
const destination = 'dist/profilepage.html'; /* optional */
 
richie(richResultType, filePath, destination);

Example of a Instance

profilepage.html
<body>
 
	<div>
 
		<!-- datecreated -->
		<p class="rjs-pp-pdt">2024-06-06 08:37 PM</p>
 
		<!-- datemodified -->
		<p class="rjs-pp-mdt">2024-02-26 05:23 PM</p>
 
		<img class="rjs-pp-img" src="https://cresteem.com/img/team/darsan.png" alt="">
 
		<!-- agentself interaction -->
		<p>Posts Written By Author: <span class="rjs-pp-aposts">87</span></p>
 
		<p>Posts Liked By Author: <span class="rjs-pp-aliked">1002</span></p>
 
		<p>Author Follows: <span class="rjs-pp-afollows">35</span></p>
 
		<p>Shared/Reposted Contents: <span class="rjs-pp-ashared">30</span></p>
 
		<!-- second-party interaction -->
		<p>Author Followers: <span class="rjs-pp-followers">391080</span></p>
 
		<p>Cummulative Likes: <span class="rjs-pp-likes">9873221</span></p>
 
		<p>Mutual Connections: <span class="rjs-pp-bicon">33</span></p>
 
 
		<!-- name -->
		<p class="rjs-pp-name">DARSAN</p>
 
		<p class="rjs-pp-altname">iamspdarsan</p>
 
		<p class="rjs-pp-uid">@iamspdarsan</p>
 
		<p class="rjs-pp-desc">
			<b>Seasoned Web Developer</b> skilled in turning design concepts into flawless,	high-performance websites. Proficient in multiple languages and frameworks, I excel in crafting	clean, maintainable and user-centric code. My expertise in <b>SEO and UI/UX</b> ensures captivating, user-focused experiences.
		</p>
 
		<div>
			<a href="https://www.instagram.com/iamspdarsan/" class="rjs-pp-rlink">instagram</a>
 
			<a href="https://www.linkedin.com/in/iamspdarsan/" class="rjs-pp-rlink">linkedin</a>
 
			<a href="https://www.youtube.com/iamspdarsan" class="rjs-pp-rlink">youtube</a>
		</div>
 
	</div>
 
	<section id="example-author-works">
 
		<!-- ra - recent activity/posts -->
		<div class="rjs-pp-awork">
			<img class="timg" src="https://abxc.com/a.jpg" alt="">
			<p class="head">This is example 1 headline</p>
			<p class="pon">2024-06-06 08:37 PM</p>
			<a class="url" href="https://www.example.com/article-1">Read More</a>
		</div>
 
		<div class="rjs-pp-awork">
			<img class="timg" src="https://abxc.com/b.jpg" alt="">
			<p class="head">This is example 2 headline</p>
			<p class="pon">2024-06-09 11:27 PM</p>
			<a class="url" href="https://www.example.com/article-2">Read More</a>
		</div>
 
	</section>
 
</body>

Output of a Instance

profilepage.html
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "ProfilePage",
  "dateCreated": "2024-06-06T20:37:00+05:30",
  "dateModified": "2024-02-26T17:23:00+05:30",
  "mainEntity": {
    "@type": "Person",
    "@id": "iamspdarsan",
    "name": "DARSAN",
    "alternateName": "iamspdarsan",
    "identifier": "iamspdarsan",
    "interactionStatistic": [
      {
        "@type": "InteractionCounter",
        "interactionType": { "@type": "FollowAction" },
        "userInteractionCount": 391080
      },
      {
        "@type": "InteractionCounter",
        "interactionType": { "@type": "LikeAction" },
        "userInteractionCount": 9873221
      },
      {
        "@type": "InteractionCounter",
        "interactionType": { "@type": "BefriendAction" },
        "userInteractionCount": 33
      }
    ],
    "agentInteractionStatistic": [
      {
        "@type": "InteractionCounter",
        "interactionType": { "@type": "WriteAction" },
        "userInteractionCount": 87
      },
      {
        "@type": "InteractionCounter",
        "interactionType": { "@type": "LikeAction" },
        "userInteractionCount": 1002
      },
      {
        "@type": "InteractionCounter",
        "interactionType": { "@type": "FollowAction" },
        "userInteractionCount": 35
      },
      {
        "@type": "InteractionCounter",
        "interactionType": { "@type": "ShareAction" },
        "userInteractionCount": 30
      }
    ],
    "description": "Seasoned Web Developer skilled in turning design concepts into flawless, high-performance websites. Proficient in multiple languages and frameworks, I excel in crafting clean, maintainable and user-centric code. My expertise in SEO and UI/UX ensures captivating, user-focused experiences",
    "image": ["https://cresteem.com/img/team/darsan.png"],
    "sameAs": [
      "https://www.instagram.com/iamspdarsan/",
      "https://www.linkedin.com/in/iamspdarsan/",
      "https://www.youtube.com/iamspdarsan"
    ]
  },
  "hasPart": [
    {
      "@type": "Article",
      "image": "https://abxc.com/a.jpg",
      "headline": "This is example 1 headline",
      "url": "https://www.example.com/article-1",
      "datePublished": "2024-06-06T20:37:00+05:30",
      "author": { "@id": "iamspdarsan" }
    },
    {
      "@type": "Article",
      "image": "https://abxc.com/a.jpg",
      "headline": "This is example 2 headline",
      "url": "https://www.example.com/article-2",
      "datePublished": "2024-06-09T23:27:00+05:30",
      "author": { "@id": "iamspdarsan" }
    }
  ]
}
</script>


Let's see what's next!