About

Hello! I am Towfiqul Islam, a freelancer web designer/developer from Bangladesh, working for 3 years now. Designing is my passion. Most of my design skills are self taught.

Other than web, print design, I design websites from scratch with XHTML, CSS, jQuery. I find website designing very challenging and interesting. I also build wordpress, Joomla and other popular CMS Templates.

Epione: Free WordPress Theme

Epione is a wordpress theme with 5 gorgeous skins.The name “Epione” derived from greek goddess of the soothing of pain.

Features

  • Fantabulous Typographic Theme.
  • Unique Homepage With Slider.
  • 5 fantastic skins.
  • Popular posts widget.
  • WordPress 3.0 Menu.
  • Mult-Level Dropdown Menu.
  • Custom login Page.
  • Social buttons to submit posts to Facebook, Twitter,
    Stumble upon, Digg, Google Buzz!
  • Awesome font.
  • Easy to use theme options.
  • Gravatar Support.
  • Threaded comments support.
  • Valid XHTML/CSS3.
  • No hidden, paid or sponsored links in the theme.
  • One Click Install. No plugin required.

Compatibility:

  • Internet Explorer 7+
  • Firefox 3+
  • Safari 5
  • Opera 9+
  • Netscape 6+

How-To change the slider speed:

You have to open up “other.js” file from your epione/js theme folder and find:

pause: 2000,

To change the speed you have to change this value to your desired need. The default is 2000 milliseconds. If you want to slow the slider down you have to increase this value and save the file.

832 Responses to “Epione: Free WordPress Theme”

  • Scott J
    on November 28, 2011 at 10:51 pm

    How do I make the front page a static front page, I don’t want
    posts, just a page. I want to do this and keep the sliders.

  • Scott J
    on December 4, 2011 at 9:06 pm

    How do I set up a static front page, but retain the slider in the latout?

  • on December 7, 2011 at 1:06 am

    Hi! How can I increase the size of the social network buttons on top of the page, and the ones below the post? Especially the ones below the posts:)

    Thanks for your help!

  • mam
    on December 13, 2011 at 5:25 am

    hi Towfiq !
    how I can add an ads or banner in left at single post ?

  • on December 15, 2011 at 9:38 am

    The Slider on our site shows the 10 pictures we have selected for our slider and then shows blank frames and never recycles..any suggestions?

  • on December 15, 2011 at 3:03 pm

    I am using JetPack not Sharedaddy for sharing.. if I remove that I lose stats

  • Jmart
    on December 20, 2011 at 8:29 pm

    How do I put images into the boxes with the little cameras next to the post titles? And when you say settings do you mean epione options?

    • Towfiq I.
      on December 20, 2011 at 9:06 pm

      use the featured image option if you are using version 1.4 if your are using 1.3, attach image to your post and the image will automatically used as thumbnail.

    • Jmart
      on December 21, 2011 at 2:29 am

      Yes I have 1.3 and that worked. Thank you. One more question…The space above the post is that for a banner or is that for pictures of my pages that slide left and right? How do I activate that space?

    • Towfiq I.
      on December 21, 2011 at 12:45 pm

      I assume you are talking about the slider. Just select the category of the slider from Appearance> Epione Options.

  • on December 27, 2011 at 9:37 pm

    hey, is there any way to change the speed of the slider?

  • on December 28, 2011 at 8:44 am

    Hi, the slider is showing the (4) post I want, then it’s showing (4) more blank pages with facebook links… Please help. I just want to see my (4) only. Thank you.

    • Towfiq I.
      on December 28, 2011 at 6:43 pm

      it looks fine to me. Although it looks like you did not set the number of slides from Appearance> Epione Options.

  • on December 29, 2011 at 7:51 am

    Thanks… 1 last question it’s about the “slider speed” I’ve went into the folder other.js changed it from 2000 to 10,000 and it’s still moving fast… I even deactivated and re-installed the revised theme pack with the changes already done. Thanks for your help.

  • on December 29, 2011 at 4:22 pm

    Thank you very much. The change did take affect. I guess I was being impatient. lol Sorry. Thanks a lot for your help.

  • on January 5, 2012 at 4:23 am

    Hi, I don’t know why the post-comment-link image is getting duplicated in my blog on the sidebar… Could you help me figure out why is this happening?

  • on January 12, 2012 at 9:15 pm

    Hey, thanks a lot for the last advice.
    Is there a way to avoid the automatic resize of the post preview images? What I want is to avoid the distortion when they get resized automatically.
    Thanks

  • Drica
    on January 15, 2012 at 11:36 pm

    Can you help me fix the css for the drop down menu? the submenu is not aligned with the it’s parent.

    Here is my style for the menu and the html in the header:

    /*MENU*/
    #menu{margin-top:40px;margin-bottom:15px; width:1000px;float:left;background: none repeat scroll 0 0 #000000;border-top: 1px solid #FFFFFF;
    }
    #menu-left {
    float:left;
    display:inline;
    width:570px;
    }
    #menu-right {
    float:right;
    display:inline; margin-right:15px;
    }
    .topmenu{}
    .menu-header{}
    .topmenu ul{ margin: 0;
    padding: 0;
    color: #FFFFFF;
    font-family: ING, LiberationMonoRegular, Arial, Helvetica, sans-serif;
    font-style:italic;
    font-size: 12px;
    font-weight: normal;
    letter-spacing: 0.1em;
    line-height: 20px;
    text-transform: uppercase;
    list-style-type: none; border: medium none;
    cursor:pointer;

    }
    .topmenu ul li{ display: inline;
    margin: 0;}
    .topmenu ul li a{ float: left;
    display: block;
    text-decoration: none;
    margin: 0;
    padding: 7px 8px; /*padding inside each tab*/
    border-right: 1px solid white; /*right divider between tabs*/
    color: white;
    background: black; /*background of tabs (default state)*/}
    .topmenu li a:visited{
    color: white;
    }
    .topmenu ul li a:hover, .topmenu ul li.selected a{
    background: #fff; /*background of tabs for hover state, plus tab with “selected” class assigned to its LI */

    color: #7661A4;
    -webkit-transition: background .5s ease-in-out;
    -moz-transition: background .5s ease-in-out;
    -o-transition: background .5s ease-in-out;
    transition: background .5s ease-in-out;
    -webkit-transition: color .5s ease-in-out;
    -moz-transition: color .5s ease-in-out;
    -o-transition: color .5s ease-in-out;
    transition: color .5s ease-in-out;
    }

    /*sub-menu*/
    .topmenu ul li ul.sub-menu, .topmenu ul li ul.children { position:absolute; z-index:888888; margin:0px; padding:5px 0px 20px 0px; width:159px; }
    .sub-menu-bottom{width:159px; height:20px; float:left;}
    .topmenu ul li ul.sub-menu li, .topmenu ul li ul.children li{ float:none; background:url(images/sub-menu_bg1.png) repeat-y;}
    .topmenu ul li ul.sub-menu li a, .topmenu ul li ul.children li a{ display:block; width:133px; background:url(images/sub-menu_border1.png) bottom repeat-x; padding:4px 0px; font-family:Georgia; color:#000; font-style:italic; font-size:12px; height:auto;}

    .topmenu ul li ul.sub-menu li ul.sub-menu, .topmenu ul li ul.children li ul.children{ margin:0px; float:left; position:relative; background:none; padding:0px;}
    .topmenu ul li ul.sub-menu li ul.sub-menu li, .topmenu ul li ul.children li ul.children li{}
    .topmenu ul li ul.sub-menu li ul.sub-menu li a, .topmenu ul li ul.children li ul.children li a{ padding-left:7px; font-size:11px; color:#feafb8;width:128px;}
    /*MENU END*/

    The HTML:

    ‘menu-header’, ‘theme_location’ => ‘primary’ ) ); ?>

    <form role="search" method="get" id="searchform" action="”>
    Search for:
    <input type="text" value="” onclick=”this.value=”;” name=”s” id=”s” />

    • Drica
      on January 15, 2012 at 11:37 pm

      Sorry, here is the html part:

      ‘menu-header’, ‘theme_location’ => ‘primary’ ) ); ?>

      <form role="search" method="get" id="searchform" action="”>
      Search for:
      <input type="text" value="” onclick=”this.value=”;” name=”s” id=”s” />

    • Drica
      on January 15, 2012 at 11:38 pm

      ‘menu-header’, ‘theme_location’ => ‘primary’ ) ); ?>

      <form role="search" method="get" id="searchform" action="”>
      Search for:
      <input type="text" value="” onclick=”this.value=”;” name=”s” id=”s” />

    • Towfiq I.
      on January 16, 2012 at 6:42 am

      Drica can you share your site address? I will have to take a look at your website.

    • Dri
      on January 16, 2012 at 9:37 am

      Thanks for the reply Towfiq. I think I got it…

  • Dri
    on January 16, 2012 at 12:17 am

    Is it possible to display the HOME link on the menu bar in the header.php?

  • Jessica
    on January 17, 2012 at 5:09 pm

    Hey! How can I change this so that it shows the full post instead of the excerpt. Also, Is there any way to alter the code so the slider shows just pictures instead of posts? Even if it’s complex, I can handle it. Thanks

    • Towfiq I.
      on January 17, 2012 at 8:08 pm

      1. Go to Appearance> Editor and select “front-page.php” from right and remove these lines:

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      
                          <!--CALL TO POST IMAGE-->
                          <?php $cti = catch_that_image();?>
                          <?php if ( has_post_thumbnail() ) : ?>
                          <?php the_post_thumbnail('medium'); ?>
       
                          <?php elseif(isset($cti)): ?>
                          <img src="<?php bloginfo('url'); ?><?php echo $cti; ?>" alt="Link to <?php the_title(); ?>" class="thumbnail"/>
       
                          <?php else : ?>
                          <div class="imgframe"></div>
       
                          <?php endif; ?>

      and then find this line:

      1
      
      <?php the_excerpt(); ?>

      and replace it with:

      1
      
      <?php the_content(); ?>
    • Jessica
      on January 18, 2012 at 6:38 pm

      thank you! front-page was the only place i hadnt looked!

    • Jessica
      on January 18, 2012 at 6:45 pm

      Thanks for this. However, after changing to the content, the picture shows above my text as well as in the side picture. Is there a way to fix this? possibly to put it back to the excerpt and then alter the excerpt to show all text but not the picture, so the picture only goes on the side once? Much appreciated!

    • Towfiq I.
      on January 18, 2012 at 6:56 pm

      post your site address… let me take a look at problem.

    • Jessica
      on January 18, 2012 at 7:09 pm

      Sorry, i figured it out. i just left it as the excerpt and modified the excerpt length from 55 words to 5000 in formatting.php under wp-includes. thanks!

  • on January 19, 2012 at 11:06 pm

    Hi, how do I import the stylesheet to the editor for this theme?

    • Towfiq I.
      on January 20, 2012 at 7:39 am

      Go to Appearance> Editor and select “Stylesheet” from right. Its already there…you don’t have to import it..

  • on January 21, 2012 at 8:44 am

    Hi! Thanks for such an amazing theme:) Quick question: How do you remove the underline from hyperlinks in text? I can’t find where this is in the CSS. I’d rather just have the color change, but no underline. What do I need to do?

    Thanks!

    • Towfiq I.
      on January 21, 2012 at 9:53 am

      Go to Appearance> Editor and select “Stylesheet” from right and add this line to your stylesheet:

      .post p a, .postcontent a{text-decoration:none;color:#ffffff}

      the color #ffffff will make the link color to white. Change the #ffffff with your choice of color code: colorpicker.com

    • on January 21, 2012 at 4:46 pm

      Hi,

      What if I want to leave the color, but just have the underline removed from the hyperlink? What code do I insert?

      Thanks!

    • Towfiq I.
      on January 21, 2012 at 5:35 pm

      just this:

      .post p a, .postcontent a{text-decoration:none;}

    • on January 22, 2012 at 2:38 am

      Thanks so much!!! Worked like a charm:)

  • jon
    on January 22, 2012 at 3:51 am

    Hey, I really enjoy your layout. But I have a question. The slider shows 4 pictures, and then it is left blank without recyclying photos. What should I do to have the photos recycled?

    Thanks!

  • Dri
    on January 24, 2012 at 3:40 am

    where can I find the comment form? I would like to change the look a little not just using css but moving things around. I just can’t seem to find where the actual form is.

    Thank you.

    • Towfiq I.
      on January 24, 2012 at 8:22 am

      its in the comments.php file. this is how the comment form is called:

      1
      
      <?php comment_form(); ?>

      Editing this would not be easy.

  • Mike
    on January 30, 2012 at 4:36 am

    How do I upload pictures and have them look porportante in the slider? Right now the post is fine but the slider picture is skewed.

  • Tom
    on January 30, 2012 at 6:21 pm

    Hi, Im fairly new to wordpress in general. I really love your theme. But i do have 3 questions.
    1. Is there a way to alter the background on the home page?2. Is there a way that my post on the front page shows a picture with that post, but the post itself doesnt show this?
    3. Is there a way to let the post header shows capitals?
    Thanks

    • Towfiq I.
      on January 30, 2012 at 10:00 pm

      1. first upload your image from Media>Add new and copy the file url after uploading the image.
      Then Go to Appearance> Editor and select “Stylesheet” from right and find this line:

      body{ background:#333 url(images/bg.gif); margin:0; padding:0; font-family:Georgia ,Arial; color:#FFF;}

      and replace it with:

      body{ background:#333 url(your copied file url; margin:0; padding:0; font-family:Georgia ,Arial; color:#FFF;}

      2. You can do it with featured image. First download the latest version of the theme from the top of the page and then use the featured image option: http://www.youtube.com/watch?v=ZMZ323LA3Ko

      3.Go to Appearance> Editor and select “Stylesheet” from right and find all the text-transform:capitalize value and replace “capitalize” with “normal”

  • Richard
    on February 2, 2012 at 4:09 am

    hi there,
    First thing, this is an awesome theme! i love it Thanks a lot.
    Just wonder how can i do a few adjustments:
    1. adjust the width of the single post page? right now it’s a bit narrow when i want to display some bigger images (cropped), would love to increase the width to say 900px for example.
    2. How to make the slide box at top a bit taller in height?

    THanks a lot

    • Towfiq I.
      on February 2, 2012 at 6:41 am

      Both of the element that you wan to modify, are using static background image If you increase the width it, the background image behind it wont increase, so it will look ugly.

    • richard
      on February 2, 2012 at 7:40 pm

      i see.. if i update the background images (i’m good with photoshop), then how can i adjust those settings?

    • Towfiq I.
      on February 2, 2012 at 10:13 pm

      Add these lines to your stylesheet:

      .postcontent, .post, #single_content .post .post_content{width:900px!important;}
      .wrapper, #menu{width:1200px!important;}

    • Richard
      on February 2, 2012 at 10:38 pm

      Thanks a lot! you are awesome

  • on December 8, 2011 at 6:35 am

    nevermind, figured it out :)

Trackbacks & Pings

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="" highlight="">