How to make an embeded a Youtube video from custom field text responsive to screen size?

Welcome to WordPress StackExchange.

This is really an HTML/CSS question rather than a WordPress specific one, so you will have better luck getting a quick answer in the future by posting to another StackExchange site, such as Stack Overflow.

However, your issue should be fixed if you set a percent as the width, rather than hard coding in a value like the 500 shown in your snippet.

For instance,

<iframe width="100%" height="315" src="https://www.youtube.com/embed/yHfLyMAHrQE" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Result: https://jsfiddle.net/qj6o4t23/

However, that will always fill 100% wide, so a better approach might be to have a max-width on it as well, which would mean using CSS rules instead of HTML attributes. 

<iframe style="width:100%; max-width: 500px; height: 315px" src="https://www.youtube.com/embed/yHfLyMAHrQE" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Result: https://jsfiddle.net/qj6o4t23/1/

With multiple rules like this, you’re better off following the best practice of defining the styles in a CSS separately.

Related Posts:

  1. Moving a PHP web-app to WordPress
  2. How to overwrite youtube embed?
  3. How can i create a function to get youtube video time
  4. wp_embed_register_handler to embed html files
  5. Creating bulk posts with Youtube videos
  6. Changing the default object embed sizes?
  7. WordPress get_media_embedded
  8. Include User ID in iFrame URL
  9. Embed video from streamtape using direct link
  10. Show Gutenberg facebook embed with a custom theme
  11. oembed facebook link?
  12. How to add a custom class for iframe by embed_oembed_html
  13. How to stop loading my custom scripts files for wordpress iframe?
  14. Custom YouTube Plugin loading different PHP library on live site and localhost
  15. How to add style in functions.php depending on conditions?
  16. Pull latest Youtube Video from json url and make new post
  17. PHP Catchable fatal error: Object of class WP_Error could not be converted to string
  18. What exactly does “Posts page” do in WordPress?
  19. How do I make my function add variables/values to the $post object?
  20. Change comments form title on a page by page basis
  21. Get the title before comma
  22. “Can’t use function return value in write context” error
  23. Display 4 chronological posts starting with a random post
  24. Displaying Only Certain Tags in Loop
  25. Duplicates with WP_Query loop
  26. WordPress automatically adds tags when pasting code, how to stop it?
  27. ACF: Only get first row of a Repeater Field
  28. Woocommerce add to cart quantity buttons with AJAX
  29. How can I use wp_query to show all product data using just the products ID?
  30. WP add_action factory
  31. how to retrieve uploaded url of zip files
  32. save imported posts as drafts
  33. How to show phpinfo() only in a new tab?
  34. RecursiveDirectoryIterator not working in admin
  35. Ajax load more posts with multiple tax query
  36. Ajax call not working
  37. WordPress Sending data to Ajax with select option
  38. Auto-Select Parent Category as Primary
  39. Long running queries
  40. comments sorting incorrectly across multiple pages
  41. auto-populating custom nav with all items from custom post type
  42. Saving plugin settings – ERROR: options page not found
  43. how to show only specific category for a template
  44. Trouble Installing WordPress Get PHP Not Running Answer
  45. WP_Query fails despite having 1 post
  46. get_posts works in the page template but not in a shortcode
  47. Add post with approval by the admin
  48. Strip Paragraph Tag
  49. Send a mail to specific address in a custom field when a new comment is made on a specific post
  50. Getting different user data depending on where I use variable
  51. WordPress PHP command and ELSE IF problem
  52. WordPress produces identical hash all the time
  53. How to unserialize data from MySQL
  54. Split site title and apply different classes
  55. using wp enqueue style to create a CSS file specifically for a page template
  56. Pass get data from anchor URL [closed]
  57. Shortcode for a Series of Elevating Image Files, Excluding a Range?
  58. Shortcode won’t execute
  59. Dynamic CSS through PHP issue
  60. posts_nav_link pulling in multiple post types
  61. How do I custom code the start page?
  62. Is it possible to isolate and use WordPress functions outside of wordpress
  63. Remove password protection from all posts
  64. Testing a Form’s Zipcode Field with Regular Expressions to Determine WordPress Page Behaviour
  65. Custom html/php/jquery map code in WordPress/elementor?
  66. My Custom Post Type AJAX Query is Returning no posts – why?
  67. Styling a category link
  68. Woocommerce display orders with products from specific categories to specific admins
  69. How to exclude meta no index pages from wp_list_pages
  70. Search bar for wp menu
  71. require get_template_directory() . ‘path/to-my/file.php’ BREAKS customize > themes functionality
  72. Remove all feeds and return custom 404 page
  73. How do I change the “login” label in My Account page to “Registered Customer”
  74. wp_get_nav_menu_items() with ACF
  75. How to add custom attribute to all outofstock and all instock products automatically?
  76. Site infected by link
  77. Cannot successfully execute AJAX script to call function.php specific function. Using XAMPP localhost to test
  78. sessionStorage saves input value in browser but it is not loaded in the form field
  79. Multiple Arrays for Custom Post Query using Boostrap accordions and ACF repeater fields
  80. Deny php execution in /wp-includes – using .htaccess in /wp-includes VS root folder
  81. SQL Query Search page
  82. Unable to get Post Category Name and URL
  83. RegExp to EXCLUDE strip HTML (FOR SOMME) comments
  84. Accessing external database: ERR_INCOMPLETE_CHUNKED_ENCODING
  85. Trying send mail from Theme page
  86. Would it be possible to route WordPress Through an MVC Application
  87. How can I put a custom field as the link of a button shortcode?
  88. jQuery vs. $ – Creating jQuery scripts in JavaScript in WordPress using External Libraries
  89. Problem using explode inside add_shortcode() callback funciton [closed]
  90. WordPress: Create A Widget to Accompany Plugin
  91. How to post data to a word press site in case of a mobile app
  92. What languages were used to build WordPress? [closed]
  93. How to strip/remove all blank spaces at the beginning/end of a search string
  94. SHARING TO FACEBOOK – FROM DYNAMICALLY GENERATED PAGE
  95. Pass a PHP variable (loop-audio.php) to jQuery function (js/script.js)
  96. why is kses removing semicolon from inline style?
  97. please on skin.php on theme wordpress option fix on theme option to not print empty variables and empty
  98. How to cut a section of a URL from a string with a regular expression?
  99. Custom nav with bootstrap dropdown
  100. Limit a search box by CPT + taxonomies, in only one page
tech