Ali-Usman

Hi,

I think you want to use HEADER IMAGE for different pages.Actually there are many ways to do this in PHP.I am gonna share that came into my mind first.I don’t know exactly how you want to do it, so I am providing you an idea about what you want to do.

1-
If you want to display RANDOM HEADER IMAGE on different pages like whenever the page is refreshed, the header image will be changed RANDOMLY.

Overview:
You need to upload some header images in the themes IMAGES folder.
eg: you want 5 different header images.Each image should have been saved with this PATTERN names: image1.jpg,image2.jpg,image3.jpg,image4.jpg,image5.jpg,
– We will use a PHP Random number between 1 & 5 to display RANDOM HEADER image on different pages.

For this, I have written some code, just take a look at it.
You need to paste this in your theme Header.php file.

<div class="custom-header"><!-- Just a CUSTOM DIV NAME -->
<?php $id = get_the_ID();//get current page id ?>
<img id="custom-header" src="PATH TO YOUR THEME DIRECTORY/hiero/IMAGES FOLDER NAME/image<?php echo htmlspecialchars(rand(1,5));?>.jpg" alt="cutom_header_<?php echo get_the_title($id); ?> "/><!-- DISPLAY IMAGE using ID-->
</div>

The id=”custom-header” is used to STYLE the IMAGE with CSS.I hope you can style the images as you want.

RECOMMENDED: Please use Custom PLUGIN(I LIKE MY CUSTOM CSS) while adding custom CSS to themes.

2-
If you want to display single different HEADER IMAGE for every different page you can do it like this.
– GET the PAGE IDs from the WP backend. eg(Home = 1, About = 2, Contact = 3)
You can use this kind of code to do the job:

<?php
if ( is_front_page() ) {
   //display homepage header image
?>
   <img id="custom-header" src="PATH TO YOUR THEME DIRECTORY/HOMEPAGE_IMAGE.jpg" alt="cutom_header"/>
<?php
} elseif ( is_page( 'About' ) ) {
    //display About Us header image
?>
   <img id="custom-header" src="PATH TO YOUR THEME DIRECTORY/ABOUT_IMAGE.jpg" alt="cutom_header"/>
} elseif ( is_page( 'Contact' ) ) {
     <img id="custom-header" src="PATH TO YOUR THEME DIRECTORY/CONTACT_IMAGE.jpg" alt="cutom_header"/>
}

RECOMMENDED:
Please create your CHILD theme first to do CUSTOM EDITING, if you don’t want to lose your coding when THEME is updated.

I hope this gives you a close idea.
Please let me know if you have something to ask.Thanks

Hi,
I have edited the code for you.You can just go to template-tags.php and REPLACE these TWO line of code with the old ones.
It will be inside athemes_content_nav function.

<?php previous_post_link( '<div class="nav-previous">%link</div>', '<span class="meta-nav">' . _x( '<i class="ico-left-open"></i>', 'Previous post link', 'athemes' ) . '</span> Previous Post' ); ?>
		<?php next_post_link( '<div class="nav-next">%link</div>', 'Next Post <span class="meta-nav">' . _x( '<i class="ico-right-open"></i>', 'Next post link', 'athemes' ) . '</span>' ); ?>

This will solve the problem.Please let me know if you have anything to ask.

Thanks.

If you don’t want to use the athemes_continue_reading_link, then you can remove functions attached with this hook and can write your own function in the child theme as well to ADD it after removing athemes_continue_reading_link.
This function will create CUSTOM CONTINUE READING with custom function:

function custom_excerpt_more() {
    return '…<a class="more-link" href="' . get_permalink() . '">CUSTOM READ MORE?</a>';
}

function my_child_theme_setup() {
    remove_filter( 'excerpt_more', 'athemes_continue_reading_link' );
    add_filter( 'excerpt_more', 'custom_excerpt_more' );
}
add_action( 'after_setup_theme', 'my_child_theme_setup' );

I hope this clears stuff in your mind.Thanks

Hi,
As you have mentioned about PAGE width, for which I have answered above.Also, you have talked about SIDEBAR.So if you want to reduce the WIDTH of sidebar and want to increase CONTENT WIDTH.Here is that you can do.
For Example: If you want to increase the CONTENT WIDTH by 100px, so you will have to reduce the SIDEBAR width by 100px.Here is what to change in CSS.
INCREASE PAGE CONTENT WIDTH:

.site-content {
/* to increase the WIDTH by reducing RIGHT margin by 100px, we get*/
margin: 0 240px 0 0;
}

REDUCE SIDEBAR WIDTH:

.site-sidebar {
/* to reduce the WIDTH by 100px,we get*/
width: 200px;
float: left;
margin: 0 0 0 -200px;
}

NOTE :(While ADDING Custom CSS, please use custom CSS plugin (I like my Custom CSS)).

Hope this helps about what you asked.
Thanks

Hi there,

I have checked that the video is not being shown on iOS devices.I think you are inserting EMBED codes MANUALLY into POSTS.So here is a solution for you, and it should help all who want to EMBED YOUTUBE videos on websites for iOS devices as well.
Just CHANGE the attribute values according to your needs, and INSERT YOUTUBE VIDEO URL to make it appear on the iOS devices.

Working EXAMPLE:

<object width="640" height="360">
<param name="movie" value="https://www.youtube.com/watch?v=Z7dLU6fk9QY&autoplay=1"/>
<param name="allowFullScreen" value="true"/>
<param name="allowscriptaccess" value="always"/>
<embed width="640" height="360" src="https://www.youtube.com/watch?v=Z7dLU6fk9QY&autoplay=1" class="youtube-player" type="text/html" allowscriptaccess="always" allowfullscreen="true"/>
</object>

I hope this helps, but I couldn’t check it on iOS device.

Thanks

Hi,

Fashionistas theme is using CSS class “container” to set a WIDTH to PAGE according to screen size.It is currently 980px for desktop screens.

You can change it by editing CSS class code block.

.container {
	/* set your desired WIDTH */
	width: 1200px;
}

IMPORTANT: Standard desktop resolution is 1024px.If you change your PAGE WIDTH to 1200 or any other WIDESCREEN size you will lose the 1024px PAGE WIDTH unless you ADD SOME MEDIA QUERIES to handle the 1024px screen size PAGE WIDTH.

NOTE:(You can use the !IMPORTANT keyword in CSS code property if your code does not get applied in browser but always try to avoid it.)

I recommend you to use CUSTOM CSS PLUGIN (I like My Custom CSS) while adding additional CSS.

Please let me know if you have any questions.I would like to help you again.Thanks

Hi,
Here is the working code.If you don’t want to change the theme functions.You can use WP remove_filter feature like this:

function child_theme_setup()
{
remove_filter('excerpt_more', 'athemes_custom_excerpt_more');
}
add_action('after_setup_theme', 'child_theme_setup');

function custom_excerpt_more($more)
{
return '<a class="more-link" href="' . get_permalink() . '">Your Read More Link Text</a>';
}
add_filter('excerpt_more', 'custom_excerpt_more');

This way you will get the CUSTOM Continue Reading text without changing theme functions.

Thanks…

Hi,

If you want to display the ARROWS with the LI elements of the DROP DOWN, which have the CHILD items(sub menu).You can use this code to display the ARROWS with them.

.sf-menu li:hover ul li.menu-item-has-children:after, .sf-menu li.sfHover ul li.menu-item-has-children:after {
display: block !important;
content: '?' !important;
border: 0px solid transparent;
border-top: 0px solid black;
float: right;
margin-top: -27px !important;
margin-right: 15px;
color: white;
}

Please let me know if you have any question.Thanks

Hi Brendan,
You are editing CHILD theme, which is a good habit instead of editing parent themes.

Yea, here is a way to customize Continue Reading → for FASHIONISTAS theme.

1- Goto your theme directory (FASHIONISTAS).
2- Find & open (inc) folder.
3- open extras.php.
4- find the following function and replace the Continue Reading → with any TEXT you want.
function athemes_continue_reading_link() {
return ‘ ‘ . __( ‘Continue Reading <span class=”meta-nav”>→</span>’, ‘athemes’ ) . ‘‘;
}

This will solve the issue…

Thanks.

Can you provide your website URL, on which you are facing this problem? to let me solve the issue accurately.

Hello,
I have looked at the website which you have mentioned for SUPER FISH MENU.It seems that the Fashionistas theme is having NO OPTION for the ARROWS in the SUPER FISH MENU.So here is what you need to do…Just copy the following code and paste it into your CSS.

.sf-menu li.menu-item-has-children:after {
display: block !important;
content: ” !important;
border: 3px solid transparent;
border-top: 5px solid black;
margin-left: -16px;
margin-top: 22px !important;
}

Explanation:
WP automatically adds CLASS to the li which has the dropdown (CHILD elements).So we can use this CLASS name (menu-item-has-children) to ADD ARROWS to the MENU elements which have dropdowns.

Again: (I will recommend using custom CSS plugin if you want to ADD Custom CSS to your theme.Just use this PLUGIN:I like My Custom CSS)

Let me know if you have any questions.Thanks

Here is the code that you can use in your theme templates to put SEARCH on any location you want.

EXAMPLE:
If you want to insert SEARCH in “Top Menu Bar”, you can just go to header.php file & find the MENU CODE and PASTE the following code above it.
<?php get_search_form(); ?>
Your SEARCH will be displayed at the frontend.

OR

Another way to put CUSTOMIZED SEARCH in the header or wherever you want.This will help you to STYLE your SEARCH BUTTON, INPUTS boxes with CSS.
<form method=”get” class=”exampleClass” action=”‘ . get_bloginfo(‘home’) . ‘/”><p><input class=”text_input” type=”text” value=”Search text here…” name=”s” id=”s” /><input type=”submit” class=”anyClassName” id=”searchSubmit” value=”search” /></p></form>

NOTE: (If you want to use CUSTOM CSS in your theme.This is the RECOMMENDED way to do this.INSTALL custom CSS PLUGIN (I like My Custom CSS) to add custom CSS without any issue).

hope this helps…