Jumat, 06 Mei 2016

Peningkatan Technopreneurship Mahasiswa Melalui Internet Marketing



Apa itu Internet Marketing ?

Apa itu Internet Marketing ? itulah pertanyaan yang muncul ketika sebagian orang sudah mulai memilih jalan usaha sebagai internet marketer. Ada pernyataan bahwa internet marketing adalah jualan di internet. Pernyataan tersebut tidak salah, namun yang lebih tepatnya internet marketing itu adalah pemasaran secara online melalui internet. Pemasaran berarti tidak hanya tentang penjualan semata, tetapi termasuk promosi, branding serta membina hubungan dengan pelanggan secara online.
Lalu apa gunanya kita melakukan internet marketing (pemasaran online)? setiap pemilik bisnis offline maupun pemilik bisnis online pasti ingin meningkatkan hasil penjualan mereka atau ingin membuat brand mereka lebih terkenal lagi. Nah, internet adalah salah satu media yang paling baik untuk memberikan informasi kepada pengguna internet (netter) tentang bisnis mereka, dan juga sebagai media untuk menjual produk yang mereka miliki.

Disini akan dijelaskan oleh Bapak Aryo Saloko yang sudah banyak berpengalaman di bidang ini kita langsung saja simak dibawah ini yang berjudul :

Peningkatan Technopreneurship Mahasiswa Melalui Internet Marketing 

Apa itu internet marketing?
Mengapa internet marketing sebagai sumber penghasilan?
Which one your passion?
Internet adalah seluruh jaringan komputer yang saling terhubung menggunakan standar sistem global Transmission Control Protocol/Internet Protocol Suite (TCP/IP) sebagai protokol pertukaran paket (packet switching communication protocol) untuk melayani miliaran pengguna di seluruh dunia. Rangkaian internet yang terbesar dinamakan Internet. Cara menghubungkan rangkaian dengan kaidah ini dinamakan internetworking ("antarjaringan").
Marketing adalah aktivitas, serangkaian institusi, dan proses menciptakan, mengomunikasikan, menyampaikan, dan mempertukarkan tawaran yang bernilai bagi pelanggan, klien, mitra, dan masyarakat umum.Secara simple saya mengartikan bahwa internet marketing adalah jualan lewat internet, atau pemasaran secara online melalui internet. Namun, dalam beberapa hal kita tidak selalu menghubungkan internet marketing hanya dengan toko online atau e-commerce saja. Contoh lain internet marketing yang ada adalah para Blogger, Youtuber, Facebooker, dan lainnya. 
 
Mengapa internet marketing bisa menjadi sumber penghasilan?
Karena banyak sekali jalan untuk mendapatkan penghasilan dari internet marketing.
Which one your passion?
BLOG ATAU WEBSITE
Disinilah passion saya hingga detik ini!!
Mengapa?
  1. Karena awalnya saya suka menulis/ mengetik
  2. Saya suka membaca, dan
  3. Saya pun suka teknologi
Bagaimana untuk memulai NGEBLOG?
Ada beberapa syarat penting saat kita ingin memulai ngeblog sebagai pemula
  1. Anda menyukai apa yang nanti anda tulis
  2. Anda memiliki sarana dan prasarana, seperti Laptop, PC, modem/ koneksi internet dan waktu luang
  3. Yang paling terpenting adalah NIAT
Kita harus memulai dari mana?
1. Membuat blog
    Ada banyak sekali jaringan blog gratis yang bisa kita manfaatkan untuk ngeblog. Seperti: 
    Blogspot, Wordpress, Tumblr, Blogdetik, dan lainnya
2. Ketahuilah bahwa tidak semua blog gratisan bisa kita manfaatkan untuk mencari penghasilan. 
     Dalam hal ini yang biasa saya manfaatkan adalah melalui BLOGSPOT
3. Sebelum membuat blogspot, pastikan anda menentukan NICHE atau TEMA

Ada beberapa cara menentukan niche:
-          Cari tema yang paling anda kuasai, misal: anda adalah pecinta sepakbola, maka anda bisa menulis blog seputar sepakbola, atau mungkin bagi wanita yang gemar masak, bisa menulis mengenai resep masakan.
-          Anda bisa menetukan tema berdasarkan berita terbaru, baik itu gosip, politik, ekonomi, dan lain sebagainya.
4. Buat blog sesuai dengan niche yang anda pilih
5. Bagaimana membuat blog kita baik di mata pengunjung ataupun di mata google?
6. Amati, tiru dan modifikasi (ATM) blog pesaing anda. Tidak copy paste
7. Promosikan blog anda melalui media social, social bookmark dan beberapa situs pendukung 
    lainnya seperti promosi di forum (kaskus, merdeka, kompas, dan lainnya).
8. Setelah anda mendapatkan pengunjung pada blog anda, maka itulah saatnya anda menguangkan 
    blog anda.

Kok Bisa NgeBlog Menghasilkan Uang?
Fokus saya disini adalah menguangkan blog kita melalui jaringan periklanan GOOGLE (Google Adsense)
Cara membuat Adsense (Exclusive)
1. Siapkan Akun gmail yang sudah verifikasi HP
2. Siapkan Domain TLD (lebih bagus yang sudah terindex)
3. Bikin blog di blogspot.com dengan akun gmail tersebut.
4. Isi dengan artikel bule 5 artikel perhari selama 1 minggu (Copas juga ga masalah asalkan di 
    cantumkan Sumber artikelnya dipostingan)
5. setelah 1 minggu hubungkan domain TLD dengan blog yang diblogspot tadi.
6. Lalu Daftarkan di Google Webmaster Tools
7. Sehari setelah dimasukkan ke Google Webmaster Tools silahkan daftar ke google adsense dengan 
    menggunakan email tadi dan blog tadi.
8. Setelah dapet email review pertama (biasanya paling cepat 2 jam setelah daftar dan paling lama 2 
    hari setelah daftar) segera untuk memasang iklan adsense di blog tadi.
9. Selesai. (Jangan lupa sambil nunggu full approve, update artikel terus minimal 2 artikel per hari)

Berapa penghasilan yang sudah saya dapatkan hingga saat ini?
“Orang optimis memandang apapun yang terjadi secara positif, sedangkan orang pesimis memandang apapun yang terjadi secara negatif”
Sekian dan terima kasih


Selasa, 05 April 2016

TUTORIAL MEMBUAT ANIMASI TEKS JATUH



SELAMAT SORE..!!!

Postingan kali ini saya akan memberikan langkah-langkah atau tutorial bagaimana cara membuat Animasi Teks Jatuh dan apa saja sintaks yang diperlukan untuk membuat Animasi Teks Jatuh. Untuk membuat Animasi Teks Jatuh ini kita memerlukan beberapa sintaks. Pada tutorial ini kita akan membuat Animasi Teks Jatuh menggunakan jQuery. Lets Go...!!!

Langkah I
Buatlah struktur data menggunakan tag HTML

<!doctype html>
<html>
<head>
<title> 201453126 </title>
<link rel="stylesheet" type="text/css" href="Fallingtex_nia_126.css" />

<link href='css.css' rel='stylesheet' type='text/css'>

<script src="jquery.min_Nia_126.js"></script>

<script src="jquery.lettering-0.6.1.min_Nia_126.js"></script>


/* =====================================
        Falling Text Rotator- by JavaScript Kit (www.javascriptkit.com)
 Visit JavaScript Kit at http://www.javascriptkit.com/ for full source code
===================================== */

</script>

<script>


jQuery(function(){ // on DOM load

        $('#headline').fallingtextrotator({
               pause:1000,
               cycles: 200,
               ontextchange:function(msgindex, msg, eachchar){
                       //console.log(msgindex, msg, eachchar)
               }
        })
})

</script>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>

<ul id="headline" class="fallingtextrotator" style="height:7em">
<li style="text-align: center"> HAIIII.... SELAMAT DATANG DI BLOG SAYA </li>
<li>NiaElPicha37.blogspot.co.id</li>
<li>SISTEM INFORMASI</li>
<li>UNIVERSITAS MURIA KUDUS</li>
<li>TERIMA KASIH</li>
<li>201453126</li>
</ul>

</body>
</html>

Langkah II
Berikan style CSS untuk memperindah tampilan blog
CSS I
@font-face
{
                                              
                                               font-family: 'Orbitron';

                                               font-style: normal;

                                               font-weight: 400;

                                               src: local('Orbitron-Light'), local('Orbitron-Regular'), url(http://fonts.gstatic.com/s/orbitron/v7/94ug0rEgQO_WuI_xKJMFc_esZW2xOQ-xsNqO47m55DA.woff) format('woff');

}

@font-face
{
                                               font-family: 'Orbitron';

                                               font-style: normal;

                                               font-weight: 700;

                                               src: local('Orbitron-Bold'), url(http://fonts.gstatic.com/s/orbitron/v7/Y82YH_MJJWnsH2yUA5AuYYbN6UDyHWBl620a-IRfuBk.woff) format('woff');
}

@font-face
{
                                               font-family: 'Orbitron';

                                               font-style: normal;

                                               font-weight: 900;

                                               src: local('Orbitron-Black'), url(http://fonts.gstatic.com/s/orbitron/v7/FyvTORElv6iWeP2Jf9yG3YbN6UDyHWBl620a-IRfuBk.woff) format('woff');
}

CSS II
ul.fallingtextrotator{

font-family: 'Orbitron', sans-serif;
font-size: 70px;
color: yellow;
text-shadow: 2px 2px #FDE0A6, 3px 3px #FDE0A6, 4px 4px #FDE0A6, 5px 5px #FDE0A6, 6px 6px #FDE0A6;
letter-spacing: 10px;
font-weight: 10;
text-transform: uppercase;
position: relative;
list-style: none;
margin: 0;
padding: 0; }

ul.fallingtextrotator >
li
{color: red;
position: absolute;
opacity: 0;
top: 0;
left: 0;
-moz-transition: all 0.3s ease-in;
-webkit-transition: all 0.3s ease-in;
-o-transition: all 0.3s ease-in;
-ms-transition: all 0.3s ease-in;
transition: all 0.3s ease-in; }
ul.fallingtextrotator > li:nth-of-type(even)
{ color: blue;
text-shadow: 2px 2px #FDE0A6, 3px 3px #FDE0A6, 4px 4px #FDE0A6, 5px 5px #FDE0A6, 6px 6px #FDE0A6; }

ul.fallingtextrotator > li span[class*="char"]
{display: inline-block;}

ul.fallingtextrotator > li.dropdown span[class*="char"]
{opacity: 0;
-moz-transform: translateY(300px) rotateZ(120deg);
-webkit-transform: translateY(300px) rotateZ(120deg);
transform: translateY(300px) rotateZ(120deg);
-moz-transition: all 0.3s ease-in
-webkit-transition: all 0.3s ease-in;
-o-transition: all 0.3s ease-in;
-ms-transition: all 0.3s ease-in;
transition: all 0.3s ease-in; }

Langkah III
Langkah terakhir berikan sintaks jQuery dibawah ini
jQuery I
 (function($){
                                               var defaults = {pause:2000, ontextchange:function(msgindex, msg, $eachchar){}, cycles:1}
                                               var transitionsupport = typeof $(document.documentElement).css('transition') != 'undefined'
                                               $.fn.fallingtextrotator = function(options){
                                                return this.each(function(){
                                                            var s = $.extend({}, defaults, options)
                                                            var $t = $(this),
                                                                                    wordgroup = [], // array holding collection of either words or chars (depending on setting)
                                                                                    curli = 0,
                                                                                    cyclescount = {cur:0, max:0}
                                                            var $lis = $t.find('>li').each(function(i){
                                                                        var $this = $(this)
                                                                                    .data('wrapperinfo', {wrapitem:i, transduration:$(this).css('transitionDuration'), currenttransition:0, wordcount:0})
                                                                                    .lettering('words').children('span').lettering().end()
                                                                        wordgroup.push( $this.find('span[class*="char"]') )
                                                                        $this.data('wrapperinfo').wordcount = wordgroup[i].length
                                                            })
                                                            cyclescount.max = $lis.length * s.cycles // get number of literations before rotator should stop

                                                            $t.on('transitionend webkitTransitionEnd', function(e){
                                                                        var $target = $(e.target),
                                                                                                $targetParent = $target.offsetParent()
                                                                        if (/transform/i.test(e.originalEvent.propertyName) && $targetParent.hasClass('dropdown')){
                                                                                    $targetParent.data('wrapperinfo').currenttransition += 1
                                                                                    if ($targetParent.data('wrapperinfo').currenttransition == $targetParent.data('wrapperinfo').wordcount){
                                                                                                $targetParent.data('wrapperinfo').currenttransition = 0
                                                                                                wordgroup[curli].css({transitionDelay:'0ms'})
                                                                                                $targetParent.css({opacity:0, transitionDuration:'0ms'}).removeClass('dropdown')
                                                                                                s.ontextchange( curli, $targetParent.text(), wordgroup[curli] )
                                                                                                curli = (curli < wordgroup.length-1)? curli + 1 : 0
                                                                                                setTimeout(function(){rotatetext()}, 50)
                                                                                    }
                                                                        }
                                                            })
                                                            function dropword(){
                                                                        if (transitionsupport && !window.opera){
                                                                                    for (var i=0; i<wordgroup[curli].length; i++){
                                                                                                var delay = Math.round( Math.random() * 1000 ) +'ms'
                                                                                                wordgroup[curli].eq(i).css('transitionDelay', delay )
                                                                                    }
                                                                                    $lis.eq(curli).addClass('dropdown')
                                                                        }
                                                                        else{
                                                                                    $lis.eq(curli).css({opacity:0})
                                                                                    curli = (curli < wordgroup.length-1)? curli + 1 : 0
                                                                                    rotatetext()
                                                                        }
                                                            }
                                              
                                                            function rotatetext(){
                                                                        var $curli = $lis.eq(curli)
                                                                        $curli.css({opacity:1, transitionDuration:$curli.data('wrapperinfo').transduration})
                                                                        if (s.cycles==0 || cyclescount.cur++ < cyclescount.max-1){
                                                                                    setTimeout(function(){
                                                                                                dropword()
                                                                                    }, s.pause)
                                                                        }
                                                            }
                                              
                                                            rotatetext()
                                                }) // end this.each()
                                               }
})(jQuery)

jQuery II
 (function($){function injector(t,splitter,klass,after){var a=t.text().split(splitter),inject='';if(a.length){$(a).each(function(i,item){inject+='<span class="'+klass+(i+1)+'">'+item+'</span>'+after});t.empty().append(inject)}}var methods={init:function(){return this.each(function(){injector($(this),'','char','')})},words:function(){return this.each(function(){injector($(this),' ','word',' ')})},lines:function(){return this.each(function(){var r="eefec303079ad17405c889e092e105b0";injector($(this).children("br").replaceWith(r).end(),r,'line','')})}};$.fn.lettering=function(method){if(method&&methods[method]){return methods[method].apply(this,[].slice.call(arguments,1))}else if(method==='letters'||!method){return methods.init.apply(this,[].slice.call(arguments,0))}$.error('Method '+method+' does not exist on jQuery.lettering');return this}})(jQuery);

Setelah script diatas ditambahkan semua, yang awalnya teks tertulis dengan rata maka hasilnya teks akan berjatuhan secara bergantian. Seperti inilah hasilnya :




 
Sekian tutorial membuat Animasi Teks Berjalan Terimakasih..

SEMOGA BERMANFAAT