I was wondering if there is a way to enable PhpStorm (or any other JetBrains tool that deals with .phtml files) to recognize conditional blocks when collapsing units of code.
I have this example:
<div class="parent">
<?php if (condition) : ?>
<div class="div1">
<?php elseif (conditionTwo) : ?>
<div class="div2">
<?php endif; ?>
<!-- Conditional block ends here -->
</div>
<!-- Parent container ends here -->
</div>
PhpStorm (by default) allows me to collapse div2 (with the first </div>), therefore div1 will need to collapse with the last </div>, which is meant to be collapse with parent.
I have attempted to adjust settings, but with no success.
Microsoft's Visual Studio Code has the correct behavior:
As you can see, in VSCode you are not allowed to collapse on <div>'s that are inside the php if block.
Thanks for your time.
This can't be configured with given code sample. You can submit this to JetBrains tracker at https://youtrack.jetbrains.com/newIssue for developers to look into it & address in next IDE versions.
Really, the issue here is how you're writing the code. It would be cleaner (and remove the edge case of not having a final else if you did something like
<div class="<?= condition ? 'div1' : 'div2'; ?>">
Related
I'm trying to use php-cs-fixer with a WordPress project, which means I (unfortunately) have files with a mix of PHP and HTML. I'm using the #PSR12 ruleset.
I'm having trouble with getting HTML within PHP control structures to indent correctly. Take this example snippet:
<?php if (!empty($related_posts)) : ?>
<div class="module--related_posts alignfull has-2-columns has-hover-state slider-on-mobile">
<h3 class="has-text-align-center">Related <?= esc_html($title) ?></h3>
</div>
<?php endif ?>
php-cs-fixer reformats it to:
<?php if (!empty($related_posts)) : ?>
<div class="module--related_posts alignfull has-2-columns has-hover-state slider-on-mobile">
<h3 class="has-text-align-center">Related <?= esc_html($title) ?>
</h3>
</div>
<?php endif ?>
Note the closing h3 tag has been moved to a new line, and the first-level indent within the if statement body has been removed.
The h3 issue I can live with, as this is resolved if I put the opening tag on its own line:
<h3 class="has-text-align-center">
Related <?= esc_html($title) ?>
</h3>
...but the lack of indent within the if statement is going to do my head in. The same thing happens with for and while statements.
Is there a rule in php-cs-fixer that I've overlooked that will resolve this?
The Answer of keradus on the "PHP code does not align with html code" issue:
PHP CS Fixer was never written with supporting mixed html/php file.
Some fixers are supporting one php part and one html part inside single file, but not big mix of them, like in template files.
If we would like to support template files, we would need to not only detect and track concrete fixers, but also provide some big integration test (like we do for Sf ruleset) that it remains to work for most important rules.
Before that happen, I would not claim that we officially support html/php mixed-files.
And in another answer:
we do not aim to fix mixed file (PHP and HTML in single file)
Not really an answer but I ended up just switching to PHP_CodeSniffer to get around this.
I have researched some answers that talk about php, javascript, iframes etc. but I have tried a couple and none of them work. I am new to HTML coding.. and coding in general!
<link rel="menu" href="menu.html"> does nothing
<!--#include virtual="/menu.html" --> does nothing (presumably because its a comment?)
<iframe src="page.html"></iframe>
or object... both place the menu in a silly little scroll box.
I want to run my menu on my page as if it were a function in C. Where I can just include it, and it be there, or just link it.
Thanks for the help!
Ryan
webpage file: biology.html
menu file: menu.html
<div class="container">
<img src="homeicon.jpg" width="50" alt="Home">
<div class="redhover">
<div class="dropdown">
<button class="dropbtn">GCSEs</button>
<div class="dropdown-content">
Chemistry
Biology
</div>
</div>
<div class="dropdown">
<button class="dropbtn">A-Levels</button>
<div class="dropdown-content">
Chemistry
Biology
</div>
</div>
<div class="dropdown">
<button class="dropbtn">University</button>
<div class="dropdown-content">
Telecommunications
Electronic Engineering
</div>
</div>
<div class="dropdown">
<button class="dropbtn">More</button>
<div class="dropdown-content">
About me
Youtube
</div>
</div>
</div>
</div>
You can use php to include files on other pages. Here is some example code to get you started:
<?php
require_once('menu.php');
?>
You can put this in your HTML page appropriately, however you must make sure that php can be processed on your server and the file containing php code must end in the .php extension.
There are also other methods of including files via php, see here:
http://php.net/manual/en/function.include.php
and
http://php.net/manual/en/function.require.php
Edit - I'm not a big fan of this approach, but it will work on Github pages.
Create a file called nav.js with your menu defined as a js variable, then use javascript to insert it into an empty div created on each page. This way to update your nav you only have to ever edit nav.js Not pretty but it works
nav.js
var navigation = "<nav>";
navigation += "<ul>";
navigation += "<li>Home</li>";
navigation += "<li>About</li>";
navigation += "</ul>";
navigation += "</nav>";
document.getElementById("navigation").innerHTML = navigation;
Other pages
<div id="navigation"></div>
<!--rest of page goes here.-->
<script src="nav.js"></script>
Fiddle: https://jsfiddle.net/ze3hLxx8/1/
There are multiple ways to include a file into another depending on the backend technology you wish / want / need to use.
PHP
The most common way to do it in php is by using the include or require statement inside a php file.
In your specific case your biology.html file must be converted to a biology.php file and then you can add the relative code to include the file:
<?php include('menu.php');?>
This simple statement will add the content in your menu.php file to the current page. This will not work if php is not present on the server and obviously will not work locally without a local development environment
The differences between require and include can be found on the official documentation:
include: http://php.net/manual/en/function.include.php
require: http://php.net/manual/en/function.require.php
SSI
Another method is to use Server Side Includes. To use the SSI it must be supported and enabled on the webserver. To use SSI you need to change the extension from biology.html to biology.shtml and then add the following statement:
<!--#include file="menu.html" -->
More information on server side includes can be found on wikipedia: https://en.wikipedia.org/wiki/Server_Side_Includes
I use mediawiki to take note about the procedure that I follow, the source codes I write in mediawiki are highlighted with the expansion Genshi Syntax HighLight. I want to modify this expansion in mediawiki so it could be created a box above the source code in which it is written the programming language I used. I tried to see expansion sources in my mediawiki but I didn't find the segment in which is "sketch" the <div>. I also saw material about the creation of new expansion in mediawiki to understand how it runs, but I don't understand where the box is created.
I use syntax hightligher like this
some_code
and this is the result in html code generate from mediawiki
<div class="mw-geshi mw-code mw-content-ltr" dir="ltr">
<div class="bash source-bash">
<pre class="de1">
some_code
</pre>
</div>
</div>
I want to prepen the div to first div, like this
<div class='gsh-lang-label'>Language bash</div>
<div class="mw-geshi mw-code mw-content-ltr" dir="ltr">
<div class="bash source-bash">
<pre class="de1">
some_code
</pre>
</div>
</div>
Can you explain me if it is possible to do it and how can I face the problem?
I think ordinary jQuery will solve this problem. Something like:
$(".mw-geshi").each(function(){
$(this).before("<div class='gsh-lang-label'>" +
$(this).children().first().attr("class").split(' ')[0] +
"</div>")
})
Put this in [[MediaWiki:Common.js]], so this script will be run for every user.
I'm working on a WordPress site. The Roots theme was installed by someone else. I want to code pages as directly as possible without using Bootstrap. I don't completely understand WordPress, but it looks to me like base.php is code that wraps every page. I'm wondering how much of this I can change without messing up the theme. Mainly I don't want to use Bootstrap. Can I just remove the references to the 'container' and 'row' classes? By the way, what are the 'wrap' and 'content' and 'main' classes? How do I find out what roots_main_class() is? Is there another way to do this, like not loading bootstrap.css?
<?php get_template_part('templates/head'); ?>
<body <?php body_class(); ?>>
<!--[if lt IE 7]><div class="alert"><?php _e('You are using an <strong>outdated</strong> browser. Please upgrade your browser to improve your experience.', 'roots'); ?></div><![endif]-->
<?php
do_action('get_header');
// Use Bootstrap's navbar if enabled in config.php
if (current_theme_supports('bootstrap-top-navbar')) {
get_template_part('templates/header-top-navbar');
} else {
get_template_part('templates/header');
}
?>
<div class="wrap container" role="document">
<div class="content row">
<div class="main <?php echo roots_main_class(); ?>" role="main">
<?php include roots_template_path(); ?>
</div><!-- /.main -->
<?php if (roots_display_sidebar()) : ?>
<aside class="sidebar <?php echo roots_sidebar_class(); ?>" role="complementary">
<?php include roots_sidebar_path(); ?>
</aside><!-- /.sidebar -->
<?php endif; ?>
</div><!-- /.content -->
</div><!-- /.wrap -->
<?php get_template_part('templates/footer'); ?>
</body>
</html>
Your question is trying to cover a lot of different points. A couple of observations:
If you don't completely understand Wordpress then I would strongly recommend you familiarise yourself with the WP documentation first.
Bootstrap is a framework; why don't you just build on top of it and use it as a starting point?
If you really don't want to use Bootstrap then it would be a lot simpler to switch to a different theme
Looking at the roots theme, there isn't bootstrap.css; there's main.min.css. You can either: A) edit that directly, B) prevent it from loading by commenting out line 14 of lib/scripts.php and enqueuing your own CSS or C) leave it as is and load your own CSS as an additional stylesheet by enqueuing it in 'lib/scripts.php`. To understand how to enqueue stylesheets in WP, refer to the WP Codex entry for wp_enqueue_style.
I'd strongly consider rethinking your question so that it is easier to answer, and maybe posting it as separate questions rather than one multi-faceted question.
I am currently working on moving an expression engine site from one server to another and i noticed one issue i am having a hardtime debugging. When i upload an logo image all seems fine but the index.php page that the logo is displayed on it has this code
{embed="shared/head"}
<body class="{if segment_1 == ''}home{if:else}{segment_1}{/if}">
<div id="page" class="container">
<div class="span-22 prepend-1 append-1 last">
{embed="shared/masthead"}
{if logo !=''}
<div class="news_item_logo">
{organization}
{if link}<img src="{logo}" width="130" alt="{title}" />{if:else}
<img src="{logo}" width="130" alt="{title}" />{/if}
{/organization}
</div><!-- /.news_item_logo -->
<ul>
<li><h3>{title}</h3></li>
<li>{pub_date}</li>
{organization}
<li>{if link}{/if}{exp:php_text_format type="lowercase"}{if url_text != ''}{url_text}{if:else}{name}{/if}{if link}{/exp:php_text_format}{/if}</li>
{/organization}
<li>{if file}PDF{/if}{if web_link !='' AND file !=''} | {/if}{if web_link}HTML{/if}</li>
</ul>
{if:else}
<ul class="no_logo">
<li><h3>{title}</h3></li>
My question is this, I see curly brackets {} around if statements and i want to know first what language it is and second is there a way to debug like php print_r() because the code always goes to the else with the no_logo class and i want to know what and how i can test these variables "segment1" and "logo" and "organization" and "url" How do and where do i inspect these variables
You can gain some info about the given variables and values in the template using the following within your index.php:
<?php
$EE = get_instance();
var_dump($this->EE->TMPL);
?>
Note that PHP must be enabled in templates for that to work (see PHP in Templates).
{embed="shared/head"} - include the template head from the template group shared
<body class="{if segment_1 == ''}home{if:else}{segment_1}{/if}">
if the URI segment (EE/CI works with segments eg site.com/segment1/segment2/xxx) is empty (you are on the home page (www.site.com), then add no body class.
else, the user is on a page (in EE this is a template group), so set the class to be the name of the template group.
site.com/about-us produces class="about-us" - handy for page specific styling.
{embed="shared/masthead"} - include masthead
and so on.
The rest are conditionals to check if the variables have values, and outputs them
I presume you're using EE2.0, I'm not sure what {organizaton} is specifically, but that style:
{organization} {foo} {/organization}
in code igniter at least, is generally the equivalent of a foreach or looping through a recordset:
foreach($organizations as $organization) { // do something }
This is written in Expression Engine's own templating language.
You would have to check the documentation to see whether there is any way to debug variables.
Possibly helpful links:
Quick Reference Chart
PHP in Templates