Cara GAMPANG bikin syntax/code highlighter di blogger/blogspot TERBARU 2021

Setelah melakukan banyak try and error akhirnya saya menemukan cara yang enak dan mudah untuk masukin code snippet ke blog saya ini. 

  1. Masuk ke menu layout
  2. Tambahkan HTML/Javascript gadget 



  3. Masukkan code ini dan simpan

<link rel="stylesheet" 
 href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.6.0/styles/atom-one-dark.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.6.0/highlight.min.js"></script>
<script>hljs.highlightAll();</script>

  1. lalu kalian tinggal pakai syntax seperti ini di dalam setiap postingan bloggernya. *note: ganti html dengan bahasa yang sesuai. list bahasa pemgrogramannya ada disini

<pre><code class="html">
// simpan codenya disini
</code></pre>



Ini beberapa contoh HASIL dari code snippet-nya:


javascript


function createApplication() {
  var app = function(req, res, next) {
    app.handle(req, res, next);
  };

  mixin(app, EventEmitter.prototype, false);
  mixin(app, proto, false);

  // expose the prototype that will get set on requests
  app.request = Object.create(req, {
    app: { configurable: true, enumerable: true, writable: true, value: app }
  })

  // expose the prototype that will get set on responses
  app.response = Object.create(res, {
    app: { configurable: true, enumerable: true, writable: true, value: app }
  })

  app.init();
  return app;
}

react (jsx)


class HelloMessage extends React.Component {
  render() {
    return (
      <div>
        Hello {this.props.name}
      </div>
    );
  }
}

ReactDOM.render(
  <HelloMessage name="Taylor" />,
  document.getElementById('hello-example')
);

php


namespace App\Exceptions;

use Illuminate\Foundation\Exceptions\Handler as ExceptionHandler;
use Throwable;

class Handler extends ExceptionHandler
{
    /**
     * A list of the exception types that are not reported.
     *
     * @var array
     */
    protected $dontReport = [
        //
    ];

    /**
     * A list of the inputs that are never flashed for validation exceptions.
     *
     * @var array
     */
    protected $dontFlash = [
        'current_password',
        'password',
        'password_confirmation',
    ];

    /**
     * Register the exception handling callbacks for the application.
     *
     * @return void
     */
    public function register()
    {
        $this->reportable(function (Throwable $e) {
            //
        });
    }
}

golang


// Validate validates an endpoint to guarantee it won't blow up when being served
func Validate(e *Endpoint) error {
	if e == nil {
		return errors.New("endpoint is nil")
	}

	if len(e.Name) == 0 {
		return errors.New("name required")
	}

	for _, p := range e.Path {
		ps := p[0]
		pe := p[len(p)-1]

		if ps == '^' && pe == '$' {
			_, err := regexp.CompilePOSIX(p)
			if err != nil {
				return err
			}
		} else if ps == '^' && pe != '$' {
			return errors.New("invalid path")
		} else if ps != '^' && pe == '$' {
			return errors.New("invalid path")
		}
	}

	if len(e.Handler) == 0 {
		return errors.New("invalid handler")
	}

	return nil
}


html


      <div role="comment" id="thread-2" data-author="marcus">
        <h3>Marcus said</h3>
        <p class="comment-text">The guitar solo could do with a touch more chorus, and a slightly lower volume.</p>
        <p><time datetime="2019-03-29T15:35">March 29 2019, 15:35</time></p>
      </div>

Komentar

  1. wah terima kasih gan, akhirnya bisa di blog saya. Gimana caranya buat fitur copy paste codenya ya gan?

    BalasHapus
  2. tombol copy pojok kanan gimana gan? otomatis juga kah?

    BalasHapus

Posting Komentar

postingan lainnya

chat app #3b - menghubungkan UI dengan graphql API

gopls not working at apple m1 visual studio code 1.54.3

chat-app #2: konfigurasi auth0 & hasura untuk backend aplikasi chat tanpa harus coding