ورڈپریس ٹیوٹوریل: ایک بہت اچھے پیج فلپ پلگ ان بنانے کے لئے کس طرح

آرٹیکل نے لکھا:
  • ان باؤنڈ مارکیٹنگ
  • اپ ڈیٹ: ستمبر 15، 2014

نوٹ: ہم اس WP پلگ ان کی حمایت نہیں کرتے ہیں کیونکہ مصنف اب ہمارے لئے لکھ نہیں کر رہا ہے.

آج شروع ہونے والے، ہر ہفتے ہم ایک زبردست کوڈنگ ٹیوٹوریل پیش کرتے ہیں، آپ کو سکھایا جائے گا کہ آپ کس طرح ورڈپریس کا استعمال کرتے ہوئے اپنی مرضی کے مواد کو بنیادی طور پر پیش کرتے ہیں. آج ہم جے ایس کا استعمال کرتے ہوئے، ایک "پلٹائیں" گیلری، نگارخانہ پیدا کرنے کے لئے ایک پلگ ان تشکیل دیں گے (لہذا آپ اس پر بنیادی اقدامات سیکھیں گے).

مجھے شرط ہے کہ آپ نے اپنے ابتدائی ویب دنوں میں ان میں سے ایک کو دیکھا ہے، لیکن ان میں سے زیادہ تر فلیش کا استعمال کرتے ہوئے کیا گیا تھا، جو اب بہت خراب ہے (اب بھی اس کی قیمت ہے، لیکن اب اس قسم کے لئے بہترین اختیار نہیں ہے).

بنیادی فعالیت ایک نیا بنائے گی گیلری، نگارخانہ کی قسم شارٹ کوڈ کے ذریعے کچھ تصاویر اور ان کے سائز پر مبنی ہے.

پھر شروع کرو

زپ اور انسٹال کریں۔

کارروائی میں اسے دیکھنے کا بہترین طریقہ خود کو انسٹال کر رہا ہے. تم کر سکتے ہو یہاں ڈاؤن لوڈ، اتارنا. پلگ ان انسٹال کریں اور چالو کریں، پھر آپ کو ایسا کرنے کی ضرورت ہے کہ ایک صفحہ میں شارٹ کوڈ شامل کریں، اس طرح:

[flip_bookids = "78 79 78 79 79 78 78 79 79" چوڑائی = "78" اونچائی = "300" ڈسپلے = "ڈبل"]

فوری پیش نظارہ

اور یہ ایسا نتیجہ ہے جسے آپ حاصل کریں گے:

فلپ بک اثر

لیکن کون سا سیاہ جادو وہاں جاتا ہے؟ ٹھیک ہے، یہ واقعی بہت آسان ہے. آئیے اس طرح کچھ پیدا کرنے کے بارے میں سیکھیں.

ہیڈر

سب سے پہلے آپ کو نیا فولڈر اور ایک نیا .پی پی فائل بنانے کی ضرورت ہوگی. اس وقت آپ کے پاس ٹیسٹ کا ماحول ہوتا ہے تو یہ بہت اچھا ہو گا، لہذا آپ چیزیں توڑ اور جانچ کر سکتے ہیں.

فائل اور فولڈر کو ایک سادہ اور منفرد نام ہونا چاہئے، لہذا آپ کو موجودہ پلگ ان کے ساتھ تنازع سے بچنے سے بچیں گے. پھر ہماری فائل کی بنیادی مواد اس طرح کچھ ہے:

/ * پلگ ان کا نام: فلپ بک گیلری، نگارخانہ تفصیل: فلپ بک گیلریوں کے لئے ایک مختصر بنائیں. ورژن: 1.0 مصنف: ویب آمدنی بلاگ لائسنس: GPL2 * /

بہت آسان، ہہ؟ ایک بار جب آپ اس فائل کو تشکیل دیں گے تو آپ اپنے پلگ ان کو WP منتظم> پلگ ان کے تحت فہرست میں دیکھیں گے، اور آپ اسے چالو کرسکتے ہیں (لیکن اگر آپ کو صرف اس فائل میں آپ کی فائل ہے تو یہ آپ کی سائٹ بہت زیادہ نہیں ہوگی).

کالنگ سکرپٹ

اب ہمیں یہاں کچھ اہم بیرونی اثاثوں کو شامل کرنے کی ضرورت ہے. بنیادی فعالیت کیلئے ضروری بیرونی فائلیں ہیں:

  • jQuery (1.9 +)
  • Turn.js سکرپٹ
  • بنیادی اسٹائل تبدیل کریں

اگر آپ صرف سکرپٹ اور طرز ٹیگز شامل کرتے ہیں تو آپ کو کچھ مسائل ملے گا. مثال کے طور پر، ڈبل jQuery کال شاید آپ کی سائٹ کو توڑ دے گی. اس کے علاوہ ورڈپریس خود کو نہیں جانتا "وہ" جو آپ نے ان چیزوں کو پیدا کیا ہے، لہذا اگر ایک مختلف پلگ ان turn.js سے دوبارہ فون کرتا ہے یا ایک مختلف اسٹائل آپ کی سائٹ کو توڑ دے گا.

لہذا ہمیں ہمیشہ wp_enqueue_script اور wp_enqueue_style افعال کا استعمال کرنا چاہئے. یہاں بنیادی استعمال ہے:

تقریب پلگ ان_scripts () {wp_enqueue_script ('jquery')؛ wp_enqueue_script ('turn'، plugins_url ('js / turn.js'، __FILE__)، array ('jquery')، '1.3'، false)؛ wp_enqueue_style ('turnCSS'، plugins_url ('سی ایس ایس / style.css'، __FILE__)، غلط، '1.3'، 'سب')؛ }

ہم 3 مختلف طریقوں میں بیرونی اشیاء کو بلا رہے ہیں، یہاں وہ ہیں:

  • موجودہ آئٹم کو کال کرنا: jQuery- ہمیں بہت سے پیرامیٹرز کو منتقل کرنے کی ضرورت نہیں ہے اگر ہم اس بات کا یقین کر لیں کہ ورڈپریس پہلے ہی اس اسکرپٹ کو لوڈ کریں، ہم صرف اس سے کہہ رہے ہیں "دوست، یہ اسکرپٹ ضرور ہو گا ورنہ ہمارے کوڈ نہیں کام"
  • ایک نیا اسکرپٹ بنانا - آپ کو کچھ صفات جیسے نام، فائل کا مقام، ضروری اشیاء (اس صورت میں یہ jQuery کی ضرورت ہے)، ورژن، اور اگر فوٹر یا ہیڈر (غلط = ہیڈر، سچ = فوٹر) میں بھرا ہوا ہے تو اسے منتقل کرنے کی ضرورت ہوگی.
  • ایک نیا انداز بنانا - پچھلے ایک ہی خصوصیت میں بہت ہی کم ہے، جس میں آخری خصوصیت میں تھوڑا سا فرق ہے، یہ کہتا ہے کہ یہ میڈیا کس طرز کے لئے ہے.

جب آپ بیرونی سکرپٹ فون کررہے ہیں تو آپ کو یہ ضروری سمجھنا ضروری ہے کہ اس پلگ ان پر زیادہ کوڈ موجود ہے. یہ بنیادی طور پر اس کی وضاحت کرتا ہے کہ آپ کی فائل ہیڈر یا فٹر میں بلایا جائے گا.

ہمارے معاملے میں، ہم صرف اس وقت HTML جب تخلیق کیے گئے گیلری، نگارخانہ قائم کرنے کے لئے کچھ اضافی سکرپٹ ہیں، اور یہ جسم میں شامل کیا جائے گا. لہذا ہم اس سکرپٹ کو سر میں اضافی طور پر شامل کرنا چاہتے ہیں، دوسری صورت میں جب ہمارے کوڈ کو "باری" کی تقریب کہا جاتا ہے تو ابھی تک نہیں ہے.

اس اچھے کوڈ کے بعد ہمیں ورڈپریس کو بتانے کی ضرورت ہوتی ہے کہ سکرپٹ کے طور پر ان کو لوڈ کرنے کے لئے، کارروائی "wp_enqueue_scripts" ایسا کریں گے:

add_action ('wp_enqueue_scripts'، 'plugin_scripts')؛

مختصر

شارٹ کوڈ بنانے کے لئے عمل کے ساتھ شروع کریں. یہ بہت آسان ہے، آپ کو صرف مختصر ٹرگر کو شامل کرنے کی ضرورت ہے، اور اس فنکشن کو مرتب کیا جائے گا:

add_shortcode ("flip_book"، "create_flip_book")؛

اب ہمیں اپنے کام کی تخلیق اور اپنی صفت حاصل کرنے کی ضرورت ہے. لیکن کچھ خاصیت اختیاری ہوسکتی ہیں، اس کا مطلب یہ ہے کہ ہمیں ان کے لئے ڈیفالٹ اقدار پیدا کرنے کی ضرورت ہوگی. اگر یہ ایرر برقرار رہے تو ہمارے ہیلپ ڈیسک سے رابطہ کریں. غلط استعمال کی اطلاع دیتے ہوئے ایرر آ گیا ہے. براہ مہربانی دوبارہ کوشش کریں. اگر یہ ایرر برقرار رہے تو ہمارے ہیلپ ڈیسک سے رابطہ کریں. غلط استعمال کی اطلاع دیتے ہوئے ایرر آ گیا ہے. براہ مہربانی دوبارہ کوشش کریں. اگر یہ ایرر برقرار رہے تو ہمارے ہیلپ ڈیسک سے رابطہ کریں.

ٹرنری آپریشن کی قسم اگر قسم کے براہ راست متغیر کی قیمت میں ہے. اس ساخت کی پیروی کرو تو

$ متغیر = (کنڈیشن)؟ "VALUE اگر شرط ہے تو درست ہے": "اگر قیمت 2 غلط ہے"؛

آپ ان کے عمل کے پہلے حصے میں کارروائی میں دیکھ سکتے ہیں:

فنکشن create_flip_book ($ attr) {// امیج تیار کرنے کے لئے $ array ['ids'] = explode (""، $ attr ['ids']) پر عملدرآمد کرنے کے لئے؛ // ڈسپلے موڈ $ صف ['ڈسپلے'] = خالی ($ attr ['display'])؟ "واحد": $ attr ['ڈسپلے']؛ // معیاری قیمت // چوڑائی $ صف ['چوڑائی'] = خالی ($ attr ['width'])؟ 400: $ attr ['چوڑائی']؛ // اونچائی $ صف ['اونچائی'] = خالی ($ attr ['height'])؟ 300: $ attr ['height']؛
    // HTML اور باقی کوڈ یہاں جاتا ہے}

تب ہمیں اپنی تصاویر کے ل the HTML ، اور بنیادی کال بنانے کی ضرورت ہوگی۔ یہاں ایک اور اہم نکتہ یہ ہے کہ اگر ہم میگزین اسٹائل استعمال کر رہے ہو تو سائز کو ایڈجسٹ کریں (یہ چوڑائی 2x ہونی چاہئے کیونکہ ہمارے پاس ایک کی بجائے 2 تصاویر ہوں گی):

<$ پی ایچ پی اگر ($ array ['display'] == "ڈبل") {$ array ['width'] = $ array ['width'] * 2؛ } $ HTML [JS اور Black Magic؟] <div id = "flipbook"> <؟ php div> <؟ php echo wp_get_attachment_image ($ array ['ids'] [$ i]، 'full')؛ اگر ($ array ['display'] == "واحد") {؟> <span> <؟ = "" (($ i + xNUMX)؟> </ <؟ گونج "" .sizeof ($ array ['ids'])؟> </ span> <؟ php} else {؟> <spanright ":" left ")؛؟>"> <؟ php echo "". میں + 0)؟> << گونج "" .sizeof ($ array ['ids'])؛ </ span> <؟ php}؟> </ div> <؟ php}؟> </ div> <سکرپٹ کی قسم = "متن / جاوا اسکرپٹ"> jQuery ("# ​​flipbook"). turn ({width: < ؟ </ php echo $ array ['width']؛؟>، اونچائی: <؟ php echo $ array ['height']؛؟>، autoCenter: true، display: '<؟ php echo $ array [' display ']؛ ؟> '، // واحد صفحہ یا ڈبل ​​صفحہ کی تیز رفتار: سچ، گرادیٹ:! jQuery.isTouch،})؛ </ سکرپٹ>

آپ کا کیا خیال ہے؟

اب آپ اس طرح کے موافقت کو بہتر بنانے اور اس میں ترمیم کرسکتے ہیں، مزید اختیارات شامل کر سکتے ہیں (مزید پریزنٹیشن کے لئے ان کی شاندار مثالیں دیکھیں)، ایڈجسٹ کرنے کے لئے آپ کے لئے کیا کام نہیں کرتا، یا اس سے دوسرے پلگ ان کے ساتھ مل کر.

کیا آپ کے پاس کوئی ورڈپریس تصور ہے جسے آپ تھوڑا سا سیکھنا چاہتے ہیں؟ شاید تم کچھ کرنا سیکھنا چاہتے ہو؟ ہمیں تبصرے کے ذریعے پتہ چلیں اور مستقبل میں پوسٹ میں ہم اس میں شامل ہونے کے لئے خوش ہوں گے!

روچسٹر اولیورا کے بارے میں

میں اسجوبا (ایم جی)، برسل سے ویب ڈیزائنر اور کاروباری ادارے ہوں. میں غیر معمولی موضوعات کے بارے میں لکھنا چاہتا ہوں اور کچھ ٹھنڈی چیزیں کر رہا ہوں.

رابطہ کریں: