New WordPress Portfolio plugin “Filterable Portfolio”

Filterable Portfolio is WordPress Portfolio plugin to display portfolio images or gallery with filtering feature to your site.

Usages

After installing and activating the plugin, a new custom post type called “Portfolios” will appear at your WordPress Admin area. Just create your Portfolio from the “Portfolios” menu & paste the following shortcode where you want to display this Portfolio:

[filterable_portfolio thumbnail='' prettyphoto_theme='']

The value of thumbnail='' can be from 1 to 6

The value of prettyphoto_theme='' can be default, dark_rounded, dark_square, light_rounded, light_square or facebook

So if you want to show three thumbnail with prettyphoto facebook theme, your shortcode should look like the following:

[filterable_portfolio thumbnail='3' prettyphoto_theme='facebook']

You can see this youtube video for more help.

New WordPress plugin “Nivo Image Slider”

Nivo Image Slider is a WordPress Image slider based on Nivo Slider to display image slider on post, page or theme. It’s an easy, simple & responsive slider, which looks awesome in every single theme.

Single Slider for a site

Just create your slides from the Slider menu & paste the following shortcode where you want to display this slider:

[all-nivoslider theme='default|dark|light|bar']

For example: if you want to add ‘light’ theme just write as following code

[all-nivoslider theme='light']

Or you can paste following to add slider to your theme:

<?php echo do_shortcode("[all-nivoslider theme='light']"); ?>

Multiple Slider for a site

If you want to use multiple slider at diffrent page or post at your theme write the following code

[nivo-slider][nivoslides image_link=''][/nivo-slider]

Inside [nivo-slider], you can add id=”” to make it unique and you can add theme by adding theme=”” and the value of theme that you can use is ‘default’, ‘dark’, ‘light’ or ‘bar’ as following

[nivo-slider id='unique-1' theme='default'][/nivo-slider]
[nivo-slider id='unique-2' theme='dark'][/nivo-slider]
[nivo-slider id='unique-3' theme='light'][/nivo-slider]
[nivo-slider id='unique-4' theme='bar'][/nivo-slider]

Repeat “[nivoslides image_link=”]” as many image as you want. Inside image_link=” put you image link like “http://lorempixel.com/400/200/sports/1/&#8221;

Inside [nivoslides image_link=”], you can also add

alt=”” to add alternative text,

caption=”” to add caption to slide like this

[nivoslides image_link='' alt='' caption='']

If you still need help, you can watch the youtube video

You can download the plugin from here.

UpThemes Framework এর ব্যবহার

Step 1. Add the framework to your theme

প্রথমে UpThemes Framework এর ZIP ফাইলটি Download করুন ঐবং জিপ ফাইলটি খুলুন। আপনার theme directory তে ‘options’ নামে একটি ফাইল তৈরি করুন জিপ ফাইলের ভিতরে থাকা সকল ফাইল ও ফোল্ডার এর মধ্যে রাখুন।

 Step 2. Create Theme Options

theme-options-example.txt ফাইলটি কপি করে আপনার theme directory তে রাখুন এবং নাম পরিবর্তন করে theme-options.php করুন।

Step 3. Include the UpThemes Framework in functions.php

নিচের কোডটি কপি করে functions.php এর সবার উপরে রাখুন

if( file_exists(get_template_directory().'/options/options.php') )
    include_once(get_template_directory().'/options/options.php');

থিম অপশন যুক্ত করতে উপরের কোডের নিচে নিম্ন বর্ণিত কোড লিখুন।

/**
* Set up General Options
*/
if( file_exists(get_template_directory().'/theme-options.php') )
    include_once(get_template_directory().'/theme-options.php')

 Step 4. Customize your options

Theme Options page নতুন ট্যাব তৈরি করতে নিচের কোডটি কপি করে পেস্ট করুন।

$thistab = array(
  "name" => "colors_and_images",
  "title" => __("Colors and Images","upfw"),
  "sections" => array(
    "color_scheme" => array(
    "name" => "color_scheme",
    "title" => __( "Color Scheme", "upfw" ),
    "description" => __( "Select your color scheme.","upfw" )
    )
  )
);
register_theme_option_tab($thistab);

Theme options রেজিস্টার করতে এবং তা ট্যাবের সঙ্গে যুক্ত করতে নিচের কোডটি লিখুন।

$options = array(
    //প্রথম অপশন
  "theme_color_scheme" => array(
    "tab" => $thistab["name"],
    "name" => "theme_color_scheme",
    "title" => "Theme Color Scheme",
    "description" => __( "Display header navigation menu above or below the site title/description?", "upfw" ),
    "section" => "color_scheme",
    "since" => "1.0",
    "id" => "color_scheme",
    "type" => "select",
    "default" => "light",
    "valid_options" => array(
      "light" => array(
        "name" => "light",
        "title" => __( "Light", "upfw" )
      ),
      "dark" => array(
        "name" => "dark",
        "title" => __( "Dark", "upfw" )
      )
    )
  )
  //দ্বিতীয় অপশন
  "theme_hyperlink_color" => array(
    "tab" => $thistab["name"],
    "name" => "theme_hyperlink_color",
    "title" => "Theme Hyperlink Color",
    "description" => __( "Default hyperlink color.", "upfw" ),
    "section" => "color_scheme",
    "since" => "1.0",
    "id" => "color_scheme",
    "type" => "color",
    "default" => "#ffffff"
  )
);
register_theme_options($options);

অন্যান্য অপশন সমুহ নিচে দেওয়া হল ।

‘type’ => ‘text’ – standard text box
‘type’ => ‘textarea’ – standard textarea
‘type’ => ‘select’ – drop-down select
‘type’ => ‘multiple’ – multiple select
‘type’ => ‘checkbox’ – checkbox
‘type’ => ‘upload’ – WordPress media uploader

নতুন ট্যাব রেজেস্টার করতে register_theme_options_tab() যবহার করুন এবং নতুন অপশন যুক্ত করতে উপরের কোডের ন্যয় register_theme_options() যবহার করুন

Using SMOF in your WordPress theme.

Step.1
———————-
SMOF download করে  আপনার theme directiry তে  option-framework নামে একটি folder তৈরি করে , তার ভিতরে SMOF এর  সকল content কপি করে  paste করুন  ।

Step.2
———————-
SMOFএর  Admin এবং Images folder দুইটি  cut করে  theme directiry তে    paste করুন ।

Step.3
———————-
আপনার functions.php তে  SMOF এর  index.php কে call করতে হবে নিচের কোডটি  functions.php তে add করার মাধ্যমে ।

include_once('admin/index.php');

নোটঃ এরপর Dashboard এ গেলে appearance এ Theme Options নামে নতুন  option দেখবেন ।

Step.4
———————-
admin folder এর ভিতর  functions folder এ functions.options.php file এ গিয়ে  Media Uploader 3.5 বা  অন্য কোন  array কে  কপি  করে  নিচের মত edit করতে হবেঃ

 

$of_options[] = array(
    "name" => "Phone Numbers",  //এই name টি theme options এ show করবে
    "desc" => "Insert phone number here",  //এই desc টি theme options এ show করবে
    "id" => "phone_number",  //এই ID টি  আপনার নির্দিষ্ট লোকেশনে কল করার php কোডে ID স্থলে লাগবে .Use the shortcodes [site_url] or [site_url_secure] for setting default URLs এই কমেন্টটি কেটে দেন
    "std" => "0535 954 74 54", // এই std টি theme options এ placeholder এর মত show করবে
    "type" => "text"  //এই type টি প্রয়োজন অনুযায়ী ভিন্ন হবে যেমনঃ text,upload,media,slider ইত্যাদি
);

নোটঃ   name, desc, std এর  value প্রয়োজন অনুযায়ী ইচ্ছামত দেয়া যাবে  আবার খালি রাখা যাবে।

Step.5
———————-
edit করার পর dashboard refresh না করে  “Options reset” button ক্লিক করতে  হবে । তাহলে  Phone number এ “std” value হিসেবে দেয়া number টা আসবে ।

Step.6
———————-
header.php তে   wp_head  এর মাঝে  global $data; নিতে হবে ।

 


 <?php
 global $data;
 wp_head(); ?>

Step.7
———————-
header.php file এ  ফোন নাম্বার ( যেমনঃ 005 657 384 85) এর স্থলে নিচের কোডটি   লিখতে হবে ।

<?php echo do_shortcode(stripslashes($data['phone_number'])); ?> 

নোটঃ [‘phone_number’] হল  functions.options.php তে ব্যবহার করা id নাম্বার ।

Step.8
———————-
আনার কাজ শেষ এবার dashboard গিয়ে আপনার প্রয়োজনীয় number বা যেই text দরকার  সেইটা লিখে save all change ক্লিক করুন
এবার refresh করুন দেখুন আপনার  কাজ হয়ে গেছে

বিশেষ নোটঃ functions.options.php file এ গিয়ে নিচের array টি কেটে দিন এটার প্রয়োজন নাই
———————-

 

$of_options[] = array(
    "name" => "Hello there!",
    "desc" => "",
    "id"   => "introduction",
    "std"  => "<h3 style=\"margin: 0 0 10px;\">Welcome to the Options Framework demo.</h3>This is a slightly modified version of the original options framework by Devin Price with a couple of aesthetical improvements on the interface and some cool additional features. If you want to learn how to setup these options or just need general help on using it feel free to visit my blog at <a      href=\"http://aquagraphite.com/2011/09/29/slightly-modded-options-framework/\">AquaGraphite.com</a>",
    "icon"     => true,
    "type"     => "info"
);

## নতুন  section যুক্ত করাঃ
————————
ধরা যাক আমরা  template এর slider এর জন্য আলাদা section করতে চাই , সেক্ষেত্রে functions.options.php ফাইলে নিচের array টি কপি  করে এর ঠিক উপরে paste করুন ।

 

$of_options[] = array(
    "name" => "General Settings",
    "type" => "heading"
);

এরপর  edit করতে হবে নিচের কোডটির মত করে ।

 

$of_options[] = array(
    "name" => "Another Settings", // আপনার ইচ্ছামত নাম দিতে পারবেন
    "type" => "heading"
);

নোটঃ  Theme options এ নতুন  section  “Another Settings” নামে আসবে ।
এবার  “Another Settings” এর  ঠিক নিচে

$of_options[] = array(
    "name" => "your name",
    "desc" => "Insert your description here",
    "id" => "your_id",
    "std" => "",
    "type" => "text"
);

আগের মত   array  নিতে   হবে এবং আগের  মত করে  এডিট  করতে হবে ,
তারপর dashboard  এ  refresh না করে  Option Reset করলে  Another Settings এর অধীনে  কাংখিত option আসবে  , সেখানে আগের    নিয়মে data change করতে পারবেন।

উপরোক্ত নিয়মে আপনি আপনার প্রয়োজন মত কাজ করতে পারবেন।

## WordPress এ SMOF ( Slightly modified options framework ) দিয়ে logo dynamic করার পদ্ধতি
————————————————————————————
Step.1
———————-
functions.options.php file এ গিয়ে       নিচের মত array কে   edit করতে হবেঃ

$of_options[] = array(
    "name" => "Logo upload",  //এই name টি theme options এ show করবে
    "desc" => "upload your logo here",  //এই desc টি theme options এ show করবে
    "id" => "logo_upload",  // এই ID টি  আপনার নির্দিষ্ট লোকেশনে কল করার php কোডে ID স্থলে লাগবে
    "std" => "logo image link",  // এই std টিতে logo image link দিতে হবে
    "type" => "upload"   //এই type টি প্রয়োজন অনুযায়ী ভিন্ন হবে যেমনঃ text,upload,media,slider ইত্যাদি
);

নোটঃ   logo image link পাওয়ার জন্য  logo image টিকে আপনার dashboard এ  গিয়ে media > add new > select file গিয়ে আপনার  logo image টি upload করুন   এবার edit এ গেলে আপনি image URL টি পাবেন

Step.2
———————-
edit করার পর dashboard refresh না করে  “Options reset” button ক্লিক করতে  হবে । তাহলে  Logo upload = “std” value হিসেবে দেয়া logo image link টা আসবে ।

Step.3
———————-
header.php file এ  logo image src এর ভিতর নিচের কোডটি   লিখতে হবে ।

<?php echo do_shortcode(stripslashes($data['logo_upload'])); ?>

নোটঃ [‘logo_upload’] হল  functions.options.php তে ব্যবহার করা id .

Step.4
———————-
আনার কাজ শেষ এবার dashboard গিয়ে আপনার প্রয়োজনীয় logo image দরকার  সেইটা upload করে  save all change ক্লিক করুন
এবার refresh করুন দেখুন আপনার  কাজ হয়ে গেছে
নোটঃ logo image এর size আপনার থিমের logo image size এর সমান  হবে।

নিবন্ধনটি RR Roundation এর facebook page থেকে নেয়া হয়েছে।