Kung hindi mo pa alam, ang mga Form ng Gravity sa ngayon ay ang pinaka-nagsisimula friendly WordPress plugin form sa pag-upload doon. Ginagamit namin ito sa aming WordPress Gallery site, WordPress Kupon site, at medyo marami lahat ng mga bagong kliyente pati na rin. Kamakailan lamang habang nagtatrabaho sa isang site ng kliyente kinailangan naming mag-tweak ang estilo ng form upang tumugma sa disenyo na kinakailangan sa amin upang ilagay ang placeholder text sa Gravity Forms. Sa kasamaang palad at kamangha-mangha, ang tampok na ito ay hindi built-in sa Gravity Forms (Yet). Habang mayroon silang pagpipilian upang magdagdag ng teksto ng placeholder sa mga drop down na patlang at field ng post: kategorya, walang pagpipilian upang magdagdag ng placeholder sa mga patlang ng input at mga patlang ng textarea. Ito ay naging isang malaking isyu para sa amin. Naghanap kami sa pamamagitan ng lugar ng suporta ng Gravity na kung saan ang tanging solusyon na magagamit ay isang tadtarin na hindi kahit na gumana nang maayos. Habang pinapayagan kami na ilagay ang teksto ng placeholder, nagkaroon ito ng mga pangunahing isyu. Kung ang gumagamit ay pindutin lamang ang isumite nang hindi aktwal na pagpuno sa patlang, ang form ay mapatunayan sa halip na bumabalik na mga error. Pagkatapos ng isang mahusay na paghahanap, natapos namin ang paghahanap ng solusyon. Sa artikulong ito, ipapakita namin sa iyo kung paano magdagdag ng teksto ng placeholder sa mga form ng grabidad gamit ang mga filter ng jQuery at Gravity Form.
Kaya marahil ikaw ay nagtataka kung bakit ba kailangan namin ang placeholder na teksto kapag may mga etiketa? Sa disenyo na aming pinagtatrabahuhan, hindi kami maaaring gumamit ng mga label para sa mga layunin ng istilo.
Ang kailangan lang naming gawin ay magdagdag ng isang function gamit ang mga filter ng Form na Gravity at gamitin ang jQuery upang i-output ang teksto.
Final Code
Ang huling code ay nasa ibaba. Maaari mo lamang kopyahin at i-paste ito sa iyong functions.php file at ito gumagana. Ngunit kung gusto mong basahin ang higit pa tungkol sa pag-andar at kung paano ito gumagana, pagkatapos ay magpatuloy sa pagbabasa ng artikulo. Patuloy din ang pagbabasa upang makita kung paano magdagdag ng teksto ng placeholder sa mga patlang ng dropdown.
Kaya ang unang bagay na kailangan naming gawin ay magdagdag ng isang halaga ng placeholder sa ilalim ng mga patlang ng Form ng Gravity sa admin panel. Upang gawin iyon, kailangan mong buksan ang mga function.php ng iyong tema at i-paste ang sumusunod na code:
Ang kaunting pag-andar na ito ay magdaragdag ng patlang ng teksto ng placeholder sa iyong backend ng Mga Gravity Form. Halimbawa screenshot ay sa ibaba:
Ngayon na idinagdag namin ang field sa admin panel, maaari kang magpatuloy at punan ang mga ito gamit ang teksto na gusto mo. Ang susunod na hakbang ay upang aktwal na maipakita ang teksto sa aktwal na form. Upang gawin ito, gagamitin namin ang jQuery. Ang kailangan mong gawin ay ilagay ang sumusunod na code sa mga function.php ng iyong tema pagkatapos ng nakaraang code:
/ * Ginagamit namin ang jQuery upang basahin ang halaga ng placeholder at i-inject ito sa field nito * /
add_action ('gform_enqueue_scripts', "my_gform_enqueue_scripts", 10, 2);
function my_gform_enqueue_scripts ($ form, $ is_ajax = false) {
?> Papalabas nito ang teksto ng placeholder sa mga patlang ng input at mga patlang ng textarea at panatiliin ang pagpapatunay nito. Ngayon na sakop na namin ito, kailangan pa rin naming magdagdag ng teksto ng placeholder sa aming mga field ng dropdown na hindi ginagawa ng maliit na snippet para sa amin. Thankfully Forms Gravity ay na built-in sa pamamagitan ng default.
Magdagdag ng Teksto ng Placeholder sa field ng Gravity Form Drop Down
Ang lahat ng kailangan mong gawin ay lumikha ng isang label na may blangko na halaga. Oo, nakapagtataka iyan sa amin noong una naming narinig ito. Ngunit talagang hindi ito. Kaya magdagdag ng isang drop down na patlang sa Gravity Forms. Mag-click sa checkbox na nagsasabing Paganahin ang Mga Halaga. Pagkatapos ay magdagdag ng Label na may blangko na halaga. Sumangguni sa screenshot sa ibaba:
Iyon lang ang kailangan mong gawin upang magdagdag ng teksto ng placeholder sa Mga Form ng Grabidad. Marahil ikaw ay nagtataka kung ito ay ang beginner friendly WordPress contact form plugin, at pagkatapos ay kung bakit hindi ito idinagdag isang bagay na ito simple na? Well, nagtaka kami ng eksaktong bagay. Kaya ang aming tagapagtatag @syedbalkhi nakipag-ugnay sa isa sa mga kasosyo sa Mga Form ng Gravity, si Carl Hancock. Nasa ibaba ang pag-uusap na mayroon sila:
@carlhancock anumang mga pagkakataon na ang isang bagay tulad nito ay makakakuha ng built-sa core ng Gravity Forms? - http://ow.ly/6sWcz
- Syed Balkhi (@syedbalkhi) Setyembre 13, 2011
@syedbalkhi Oo. Inaasam namin na palawakin ang suporta sa katangian ng placeholder ng HTML5 upang mapalawak namin ang dalisay na HTML5. Ngunit hindi.
- Carl Hancock (@carlhancock) Setyembre 13, 2011
@syedbalkhi Kaya kami ay sinusubukan upang pigilan kaya hindi namin kailangang fallback sa javascript.Sa kasamaang palad browser ay hindi cooperated.
- Carl Hancock (@carlhancock) Setyembre 13, 2011
Kaya't nakita mo na ito ay isang bagay na alam nila, at ito ay idaragdag sa mga release sa hinaharap. Upang makita ang lahat ng mga kahanga-hangang bagay na maaaring gawin ng mga form ng gravity, tingnan lamang ang aming post tungkol sa mga Form ng Gravity.
Kredito sa kahanga-hangang pag-andar at jQuery snippet ang papunta sa Jorge Pedret (@jorgepedret).