Tell me a little bit about yourself and your work My name is Anna. I am the community manager at Geekle. Currently, I am working on 3 events – React Global Summit, Flutter Global Summit. Vol 2 and Robotics Global Summit. Also, I am a Ph.D. student in political science. Before joining Geekle I tried
Author: imranhsayed
Dynamically populate a select field’s choices for Custom Post Types— ACF
Posted onAdding the dynamic select field choices in Advanced Custom Fields can be challenging, as ACF does not offer this feature by default. In this blog, we will discuss to do just that. Register a custom field with name ‘post_type_selection’ and field type ‘Select’ Now let’s write the PHP code as described above. Notice that, we
Extending Yoast To Add Your Custom Schema With Pieces
Posted onIn this blog we will learn about how to extend the Yoast to output our Custom Yoast Schema Pieces. You can get more details about what you fields require in the schema by searching it here Now let’s instantiate the above Review Class Now Check the JSON LD in your single post src, it would
Create Data Table Block With ACF, dataTables, And Sticky First Column
Posted onIn this blog, we will learn about how to create a data table block with ACF. I am assuming you have the ACF pro plugin. This table will allow you to sort the data, as well as the first column, will be sticky. Register ACF Data Table Block Let’s register our block first. Create Custom
Build Multiple Gutenberg Blocks Using block.json | Custom SVG Icon For Blocks
Posted onIn this blog, we will learn about how to build multiple custom Gutenberg blocks with the new convention of using block.json. Create Files for Style and Script Create a file called index.js and index.css in test-block directory. Creating block.json file Create a file called block.json and define all the properties. Register Block Client side. Place
Maintaining A 16:9 Responsive Aspect-Ratio Of An Image Using CSS
Posted onOne of the greatest challenges developers face is to maintain an aspect ratio of multiple images with unknown dimensions. In this blog, we will learn just that. Let’s take an example of these two images with different dimensions. The problem is that we cannot give it a fixed height because the width will change in
Saving the ACF JSON locally to your plugin or theme file | Save, Load and Sync Advanced Custom Fields JSON
Posted onSaving the ACF JSON files locally allows you to have version control over your field settings! Let’s learn how to do that. Create an acf-json directory Create a directory called acf-json in your plugin. Save the JSON Add the following in your functions.php file Now when you hit save/update for each ACF Group , it is going
Mailchimp Newsletter Subscription in Next.js React Application
Posted onIn this blog we will learn about how to add a mailchimp newsletter subscription in a Nextjs react application. Get the Mailchimp URL Create an account on Mailchimp if you don’t already have one.Create an audience campaign. Navigate to Campaigns > Signup Forms > Signup forms tab and click on Embed forms and then select. Copy the the form action value
Setup PWA Workbox Webpack Plugin for React Application | Workbox Window | Precaching | Caching at runtime
Posted onIn this blog we will learn how to convert a React App into a PWA using Workbox WebpackPlugin, workbox-window etc. We will do pre-caching of a few assets and few api response at runtime, using strategies like StaleWhileRevalidate and Cache Firstetc. Demo site Source Code Install workbox webpack plugin Install these packages. Webpack Configuration Add these configuration to
Create Stripe Checkout In Next.js | Stripe Session | Stripe Webhook.
Posted onIn this blog you will learn how to create a stripe session, redirect the user to the stripe checkout and also create stripe webhook that listens to when the payment is made. Live Demo Example Create Next.js app Create stripe keys and put them in next.js`.env` fileCreate a stripe account if you don’t already have