EXPECTED OUTPUT

I am attempting to enqueue two stylesheets in Wordpress child theme.

I have written front-page.php for which I wish to apply exclusively front-page-style.css.

In addition, I have written header.php to override the parent theme's header. I have written style.css override the parent's stylesheet if it is in conflict.

ACTUAL OUTPUT

For neither front-page.php nor all other pages, neither the parent or the child stylesheet is being applied.

CODE

FOLDER STRUCTURE

+-- oceanwp
+-- oceanwp-child-theme-master
| +-- functions.php
| +-- style.css
| +-- front-page-style.css
| +-- front-page.php
| +-- header.php

Functions.php

function oceanwp_child_enqueue_parent_style() {
    // Dynamically get version number of the parent stylesheet (lets browsers re-cache your stylesheet when you update your theme)
    $theme   = wp_get_theme( 'OceanWP' );
    $version = $theme->get( 'Version' );
    // Load the stylesheet
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array( 'oceanwp-style' ), $version );

}

function my_theme_enqueue_styles() {
    $parent_style = 'oceanwp-style';
    // if the page is front-page.php, apply front-page-style.css
    if ( is_front_page() ) {
    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' , '/style-rtl.css' );
        wp_enqueue_style( 'child-style',
            get_stylesheet_directory_uri() . '/front-page-style.css',
            array( $parent_style ),
            wp_get_theme('')->get('Version')
         );
    }

    // if the page is not front-page.php, apply style.css (CHILD) first and style.css (PARENT) second
    if (!is_front_page() ) {
        wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' , '/style-rtl.css' );
        wp_enqueue_style( 'child-style',
            get_stylesheet_directory_uri() . '/style.css',
            array( $parent_style ),
            wp_get_theme('')->get('Version')
         );
    }
}

add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles', 'my_custom_scripts' );

?>

You can use this function. Insert this code in functions.php

add_action( 'wp_enqueue_scripts', 'styles_custom');
function styles_custom() {
    global $post;
    $post_slug=$post->post_name;

    if ( is_front_page() ) { //only homepage
        wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' , '/style-home.css' );
    }

    if (!is_front_page() ) { //all page, not homepage
        wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' , '/style-all.css' );
    }
    if($post_slug == 'contact'){ //only page contact
        wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' , '/style-contact.css' );
    }
    if($post_slug == '[.....]'){
        wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' , '/style.css' );
    }
}

You can use post_slug, (e.g. Contact Us -> contact-us)

You need to add a do_action() hook for each of your function.

function oceanwp_child_enqueue_parent_style() {

  $theme   = wp_get_theme( 'OceanWP' );
  $version = $theme->get( 'Version' );

  wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css',array( 'oceanwp-style' ), $version );
}
// ADD THIS
add_action( 'wp_enqueue_scripts', 'oceanwp_child_enqueue_parent_style');


function my_theme_enqueue_styles() {

  $parent_style = 'oceanwp-style';

  if ( is_front_page() ) {
    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' , '/style-rtl.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/front-page-style.css',
        array( $parent_style ),
        wp_get_theme('')->get('Version')
    );
  }else{
     wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' , '/style-rtl.css' );
     wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme('')->get('Version'));
   }
}
// UPDATE THIS
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles');

simply you need to assign the style file to a page template in wordpress you can check template by it's name using

<?php if(is_page_template( <your template name> ) ){} ?>

inside functions.php you can use this example

function register_foundation_style() {
  if ( is_page_template( <tamplate file name> ) ) {
    wp_enqueue_style( 'foundation', get_stylesheet_directory_uri() . '/foundation/css/foundation.min.css' );
}
}
add_action( 'wp_enqueue_scripts', 'register_foundation_style' );
?>

Solution by https://dobsondev.com/2015/06/05/conditionally-enqueue-stylesheet-into-wordpress-for-certain-page/