How to Add Python-Generated Data and Charts to WordPress (Step-by-Step Guide)

क्या आप एक ब्लॉगर हैं, और अपनी WordPress Website पर Python-Generated data and charts जोड़ना चाहते हैं? यदि हां, तो यह लेख आपके लिए ही है, इसलिए लेख को अंत तक जरूर पढ़ें और अपनी प्रतिक्रियाओं से भी हमें जरूर अवगत कराएं! चलिए, अब मुद्दे पर आते हैं-

वैसे तो WordPress डिफ़ॉल्ट रूप से Python को सपोर्ट नहीं करता है, क्योंकि यह PHP पर आधारित है। लेकिन, कुछ आसान और एडवांस तरीकों को अपनाकर आप Python-जनरेटेड डेटा और चार्ट अपनी वर्डप्रेस वेबसाइट में जोड़ सकते हैं।

इसके लिए इस ब्लॉग पोस्ट में, हम तीन अलग-अलग तरीकों पर चर्चा करेंगे जिनसे आप Python-जनरेटेड डेटा और चार्ट को WordPress में जोड़ सकते हैं। फिर चाहे आप साधारण इमेज चार्ट चाहते हों या इंटरएक्टिव लाइव डेटा, यहां हर जरूरत का समाधान है।

WordPress में Python-जनरेटेड चार्ट जोड़ने के 3 तरीके-

1️⃣ Matplotlib से चार्ट बनाकर इमेज अपलोड करें (सबसे आसान तरीका)

यदि आप सबसे आसान और SEO-फ्रेंडली तरीके से चार्ट जोड़ना चाहते हैं, तो Matplotlib का उपयोग करके चार्ट इमेज (.png, .jpg) बनाएं और इसे वर्डप्रेस में अपलोड करें।

कैसे करें?

1. Python में Matplotlib का उपयोग करके चार्ट बनाएं।
2. चार्ट को इमेज फाइल के रूप में सेव करें।
3. इमेज को वर्डप्रेस मीडिया लाइब्रेरी में अपलोड करें।
4. ब्लॉग पोस्ट या पेज में इमेज जोड़ें।

Example- यदि आपके ब्लॉग का नाम ‘blogman.in’ है, और आप अपने ब्लॉग के ट्रैफिक डेटा को चार्ट के रूप में दिखाना चाहते हैं, तो अपने Code Editor मे निम्नलिखित Python कोड लिखें-

Python कोड:

import matplotlib.pyplot as plt

# ब्लॉग ट्रैफिक डेटा (उदाहरण)
months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun"]
visitors = [5000, 7000, 8000, 12000, 15000, 18000]  # मासिक विज़िटर्स

# चार्ट बनाएं
plt.figure(figsize=(10, 5))
plt.plot(months, visitors, marker='o', color='blue', label="ब्लॉग विज़िटर्स")
plt.title("Blogman.in का मासिक ट्रैफिक (2023)", fontsize=16)
plt.xlabel("महीना", fontsize=12)
plt.ylabel("विज़िटर्स", fontsize=12)
plt.legend()
plt.grid(True)

# चार्ट को इमेज के रूप में सेव करें
plt.savefig("blog_traffic_chart.png")

WordPress में इस्तेमाल–

1. ऊपर दिए गए कोड को रन करें और blog_traffic_chart.png फाइल जनरेट करें।
2. इस इमेज को वर्डप्रेस मीडिया लाइब्रेरी में अपलोड करें।
3. ब्लॉग पोस्ट में इमेज जोड़ें और ALT टेक्स्ट में “Blogman.in का मासिक ट्रैफिक चार्ट” लिखें।

फायदे–

• SEO के लिए अनुकूल।
• कोडिंग की कम जरूरत।
• तेज़ और आसान तरीका।

2️⃣ Google Charts या Chart.js से इंटरएक्टिव चार्ट जोड़ें (बिना Python)

अगर आप इंटरएक्टिव चार्ट चाहते हैं, तो Chart.js या Google Charts जैसे टूल का उपयोग कर सकते हैं। Python से डेटा को CSV या JSON फाइल में सेव करें और इसे Chart.js में लोड करें।

कैसे करें?

1. Python से डेटा को CSV या JSON फाइल में सेव करें।
2. Chart.js या Google Charts का उपयोग करके इंटरएक्टिव चार्ट बनाएं।
3. वर्डप्रेस में सिर्फ Embed Code जोड़ें।

यदि आप इंटरएक्टिव चार्ट चाहते हैं, तो Chart.js का उपयोग करें। उदाहरण के लिए यहां हम ‘blogman.in’ वेबसाईट के ब्लॉग पोस्ट के परफॉर्मेंस (जैसे- Views, Shares and Comments) को दिखाएंगे।

इसके लिए आप अपने Code Editor मे निम्नलिखित HTML + JavaScript कोड लिखें-

HTML + JavaScript कोड:

<canvas id="blogPerformanceChart"></canvas>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<script>
  var ctx = document.getElementById('blogPerformanceChart').getContext('2d');
  var blogPerformanceChart = new Chart(ctx, {
      type: 'bar',
      data: {
          labels: ["पोस्ट 1", "पोस्ट 2", "पोस्ट 3", "पोस्ट 4", "पोस्ट 5"], // पोस्ट के नाम
          datasets: [{
              label: 'व्यूज',
              data: [1200, 1900, 3000, 2500, 2000], // व्यूज डेटा
              backgroundColor: 'rgba(54, 162, 235, 0.5)',
              borderColor: 'rgba(54, 162, 235, 1)',
              borderWidth: 1
          },
          {
              label: 'शेयर्स',
              data: [200, 400, 600, 500, 300], // शेयर्स डेटा
              backgroundColor: 'rgba(75, 192, 192, 0.5)',
              borderColor: 'rgba(75, 192, 192, 1)',
              borderWidth: 1
          },
          {
              label: 'कमेंट्स',
              data: [50, 100, 150, 120, 80], // कमेंट्स डेटा
              backgroundColor: 'rgba(255, 99, 132, 0.5)',
              borderColor: 'rgba(255, 99, 132, 1)',
              borderWidth: 1
          }]
      },
      options: {
          scales: {
              y: {
                  beginAtZero: true
              }
          }
      }
  });
</script>

WordPress में इस्तेमाल–

1. वर्डप्रेस एडिटर में “Custom HTML” ब्लॉक चुनें।
2. ऊपर दिया गया कोड पेस्ट करें।
3. पोस्ट प्रकाशित करें और इंटरएक्टिव चार्ट देखें।

फायदे–

• इंटरएक्टिव चार्ट।
• उपयोगकर्ता अनुभव बेहतर।
• लाइव डेटा अपडेट करने की सुविधा।

3️⃣ Python API से लाइव डेटा जोड़ना (एडवांस तरीका): लाइव ब्लॉग एनालिटिक्स

यदि आप लाइव डेटा अपडेट चाहते हैं, तो Python में Flask API बनाकर इसे किसी External Server (AWS, Digital Ocean) पर होस्ट करें। वर्डप्रेस इस API से JSON डेटा फेच करेगा और JavaScript के जरिए लाइव अपडेट दिखाएगा।

कैसे करें?

1. Python में Flask API बनाएं।
2. API को एक्सटर्नल सर्वर पर होस्ट करें।
3. वर्डप्रेस में JavaScript का उपयोग करके API से डेटा फेच करें।
4. डेटा को वेब पेज पर डिस्प्ले करें।

फायदे–

• यह तरीका थोड़ा सा एडवांस है, लेकिन पूरी तरह ऑटोमेटेड होगा।
• लाइव डेटा अपडेट।
• हाई परफॉर्मेंस।

यदि आप अपने किसी ब्लॉग पोस्ट मे लाइव डेटा दिखाना चाहते हैं, तो Python Flask API का उपयोग करें। उदाहरण के लिए यहां हम ‘blogman.in’ के ब्लॉग एनालिटिक्स (जैसे live visitors) को दिखाएंगे।

Python Flask API कोड:

from flask import Flask, jsonify
import random

app = Flask(__name__)

@app.route('/api/blog-analytics', methods=['GET'])
def blog_analytics():
    data = {
        "live_visitors": random.randint(100, 500),  # रैंडम लाइव विज़िटर्स
        "top_posts": ["पोस्ट 1", "पोस्ट 2", "पोस्ट 3"]  # टॉप पोस्ट
    }
    return jsonify(data)

if __name__ == '__main__':
    app.run(debug=True)

WordPress में इस्तेमाल-

1. Flask API को होस्ट करें (उदाहरण: AWS, Digital Ocean)।
2. wordpress में निम्नलिखित JavaScript का उपयोग करके API से डेटा फेच करें।

<div id="blogAnalytics"></div>
<script>
  fetch('https://your-api-url/api/blog-analytics')
    .then(response => response.json())
    .then(data => {
      document.getElementById('blogAnalytics').innerHTML = `
        <h3>लाइव विज़िटर्स: ${data.live_visitors}</h3>
        <p>टॉप पोस्ट: ${data.top_posts.join(', ')}</p>
      `;
    });
</script>

कौन सा तरीका बेस्ट रहेगा?

• अगर आप सिर्फ चार्ट दिखाना चाहते हो, तो पहला तरीका सबसे आसान है (इमेज अपलोड)।
• अगर इंटरएक्टिव चार्ट चाहिए, तो दूसरा तरीका (Chart.js) अच्छा है।
• और,अगर लाइव डेटा अपडेट चाहिए, तो Python API सेटअप करना पड़ेगा।

निष्कर्ष

उम्मीद है, अब आपको समझ मे आ गया होगा कि wordpressपर Python-Generated data and charts जोड़ना उतना मुश्किल नहीं है जितना लगता है। इस लेख मे बताए गए तरीकों से आप अपनी Website मे पोस्ट से संबंधित डेटा और चार्ट को आसानी से जोड़ सकते हैं।

चाहे आप सरल इमेज चार्ट चाहते हों या इंटरएक्टिव लाइव डेटा, यहां अपनी हर जरूरत के अनुसार बना सकते हैं। बस सही तरीका चुनें और अपनी वेबसाइट को और भी अधिक प्रोफेशनल बनाएं!

क्या आपको यह गाइड मददगार लगी? कमेंट में बताएं और सवाल पूछें!

ChatGPT से ब्लॉगिंग करने का सही तरीका – 90% लोग करते हैं ये गलतियां!