Skip to content

Instantly share code, notes, and snippets.

Avatar

Isaac Ben Hutta itzikbenh

View GitHub Profile
View app.js
import Vue from 'vue';
import posts from './components/posts.vue';
window.axios = require('axios');
window.Vue = Vue;
Vue.component('posts', posts);
const app = new Vue({
el: '#app',
@itzikbenh
itzikbenh / TicketController.php
Last active Jun 9, 2021
Laravel server side processing for Datatables.
View TicketController.php
<?php
use Illuminate\Pagination\Paginator;
//This example is a bit more comlex since I have columns that are foreign keys of the Ticket table.
public function index(Request $request)
{
if($request->ajax()) {
$columns = ['tickets.id', 'client_name', 'location', 'priority_name', 'status_name', 'date'];
$draw = $request->draw;
$start = $request->start; //Start is the offset
$length = $request->length; //How many records to show
View lightbox.vue
<template>
<div>
<a href="#" @click.prevent="show" class="w-full">
<img class="w-64" :src="thumbnail">
</a>
<div class="lightbox fixed pin z-50 flex justify-center items-center" v-if="visible" @click="hide">
<div class="fixed pin-r pin-t text-white cursor-pointer text-4xl p-1 mr-2" @click.stop="hide">&times;</div>
<div class="flex">
<div class="cursor-pointer self-center px-8"
@click.stop="prev"
@itzikbenh
itzikbenh / README.md
Last active Dec 28, 2020
WordPress - How to upload images from a frontend form via the rest-api.
View README.md

Before you go over the snippets I will summarize which functions are being used.

media_handle_upload('image', 0);

That's it! one function that would insert the image into the DB, create four copies with different sizes, and upload to the uploads directory. Regarding the arguments:

'image' is what holds all the data about the image. It comes from the POST request. In the JS file you will see what I mean.

'0' This is the $post_id. I set it to zero, because i'm not asigning this image to any post at the moment. In order for this function to work we need to add above it:

@itzikbenh
itzikbenh / home.php
Last active Apr 5, 2020
Very simple infinite scroll in WordPress.
View home.php
//Just a random file for loading your posts to see that the infinite scroll works.
<?php get_header(); ?>
<div class="col-md-6 col-md-offset-3">
<div class="post-container">
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<div class="page-header post">
<h1><?php the_title(); ?></h1>
<p><?php the_excerpt(); ?></p>
</div>
@itzikbenh
itzikbenh / functions.php
Last active Jan 25, 2020
WordPress auto-complete post search by title with typeahead-bootstrap
View functions.php
function theme_styles()
{
wp_enqueue_style( 'boostrap_css', 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css' );
wp_enqueue_style( 'theme_css', get_template_directory_uri() . '/css/theme.css' );
}
add_action( 'wp_enqueue_scripts', 'theme_styles' );
function theme_js()
{
@itzikbenh
itzikbenh / thz_disable_gutenberg.php
Created Oct 31, 2018 — forked from danyj/thz_disable_gutenberg.php
Disable Gutenberg globally or for specific post types for WordPress 5.0 and UP
View thz_disable_gutenberg.php
<?php
/*
* Disable Gutenberg globally
* use this if you prefer one-liner
* add_filter('use_block_editor_for_post', '__return_false');
*/
function _thz_filter_disable_block_editor(){
return false;
}
add_filter( 'use_block_editor_for_post', '_thz_filter_disable_block_editor' );
@itzikbenh
itzikbenh / events_template.php
Last active Jan 9, 2020
Load WordPress posts via a custom API endpoint with pagination support.
View events_template.php
<div class="posts-container">
<?php if ( $the_query->have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<div>
<?php
//Here we group events by event_date and put the date at the top.
$event_date = get_post_meta( $post->ID, 'event_date', true );
if ( $event_date != $date )
{
$event_date_formatted = date( 'l, F jS, Y', strtotime( $event_date ) );
echo "<p class='page-header'><strong>$event_date_formatted</strong></p>";
View button.php
<button class="delete-post" id="<?php echo $post->ID ?>" type="button" name="button">
Delete Post
</button>
@itzikbenh
itzikbenh / gulpfile.js
Last active Jan 9, 2020
Gulp configuration for my WordPress theme development
View gulpfile.js
/*
Create package.json and install all packages:
1. npm init
2. npm install -g gulp
3. npm install gulp gulp-babel babel-preset-es2015 gulp-concat gulp-csso gulp-rename gulp-sass gulp-uglify gulp-watch browser-sync --save-dev
Expected file structure:
./css/src/*.scss