Tabbed user interface with a panel that expands downward
There are a few things you can do to reduce the code, for example:

you can use add to add jquery selections:

$('.product-filter').add('.sortby').css('display', 'none');

rather then have lots of nested if's you can use a ternary op and seperate them to seperate functions:

var action =  $(this).hasClass('active') ? handleActive : handleInactive;
action.call(this);

function handleActive () {
    if ($(this).hasClass('filter-header'))  {

        $('.clickable-header').removeClass('active');
        $(this).addClass('active');
        $('.sortby').slideUp(speed);
        $(this).parent().find('.dropable-section').slideDown(speed);
        $('#category-products').animate({ 'marginTop': filterHeight}, speed);
    }

    if ($(this).hasClass('sort-by-header'))  {

        $('.clickable-header').removeClass('active');
        $(this).addClass('active');
        $('.product-filter').slideUp(speed);
        $(this).parent().find('.dropable-section').slideDown(speed);
        $('#category-products').animate({ 'marginTop': sortbyHeight}, speed);
    }
}

function handleInactive () {
     if ($(this).hasClass('filter-header'))  {

         $(this).parent().find('.dropable-section').slideUp(speed);
         $('#category-products').animate({ 'marginTop': 0}, speed);
     }

     if ($(this).hasClass('sort-by-header'))  {

         $(this).parent().find('.dropable-section').slideUp(speed);
         $('#category-products').animate({ 'marginTop': 0}, speed);
     }
}


you can also remove the duplication where the same outcome is reached regardless of the if, such as:

if ($(this).hasClass('filter-header'))  {

            $('.clickable-header').removeClass('active');
            $(this).addClass('active');
            $('.sortby').slideUp(speed);
            $(this).parent().find('.dropable-section').slideDown(speed);
            $('#category-products').animate({ 'marginTop': filterHeight}, speed);
        }

        if ($(this).hasClass('sort-by-header'))  {

            $('.clickable-header').removeClass('active');
            $(this).addClass('active');
            $('.product-filter').slideUp(speed);
            $(this).parent().find('.dropable-section').slideDown(speed);
            $('#category-products').animate({ 'marginTop': sortbyHeight}, speed);
        }


could be reduced to:

$('.clickable-header').removeClass('active');
$(this).addClass('active');
$(this).parent().find('.dropable-section').slideDown(speed);

if ($(this).hasClass('filter-header'))  {
  $('.sortby').slideUp(speed);
  $('#category-products').animate({ 'marginTop': filterHeight}, speed);
}

if ($(this).hasClass('sort-by-header'))  {
  $('.product-filter').slideUp(speed);
  $('#category-products').animate({ 'marginTop': sortbyHeight}, speed);
}